このJavaScriptの仕組みはどのように機能しますか？

このコードは身体にちょうど詰まっていますが、私が期待しているとおりに正確に行いますが、なぜわかりません。このJavaScriptの仕組みはどのように機能しますか？

特に私はwebserviceが呼び出されるのを見ていませんが、スクリプトはHeadセクションにコールを追加してページをリロードするようですが、わかりませんし、 script.onload = script.onreadystatechange =機能（）

誰でもしてください説明できますか？

var script = document.createElement("script"), 
    head = document.getElementsByTagName("head")[0], 
    url = "https://services.postcodeanywhere.co.uk/PostcodeAnywhere/Interactive/FindByPostcode/v1.00/json.ws?"; 

// Build the query string 
url += "&Key=" + encodeURI(pca_Key); 
url += "&Postcode=" + encodeURI(postcode); 
url += "&CallbackFunction=PostcodeAnywhere_FindByPostcode_End"; 

script.src = url; 

// Make the request 
script.onload = script.onreadystatechange = function() { 
    if (!this.readyState || this.readyState === "loaded" || this.readyState === "complete") { 
     script.onload = script.onreadystatechange = null; 
     if (head && script.parentNode) 
      head.removeChild(script); 
    } 
} 

head.insertBefore(script, head.firstChild);

ステュー

出典

2011-12-16 Stuart

基本的に、postcodeanywhere.co.ukからいくつかのデータを取得するためにJSONP呼び出しを行っています。 JSONPはscript要素を使用します。あなたはそれを示したが、おそらくありますされていない

：postcodeanywhere.co.ukからのスクリプトは、このようなものは、JavaScriptオブジェクトリテラルを渡し、スクリプトURLにCallbackFunction引数によって識別される関数を呼び出します呼び出しを行うスクリプト内のグローバルスコープで定義されたその名前の関数。

これは、Ajaxは、クロスオリジン呼び出すことはできませんSOP、回避することです。それは、script要素を作成し、それをsrc URLを割り当て、ページにそれを追加し、それが再び要素を除去することによって、自分自身後にクリーンアップすることができますので、readystateイベントをフックしているどのよう

。（その最後のビットは、それが何ができるか、すべてのブラウザは徹底的にこれを行うには、あなたがフックする必要があり、script要素にreadystateイベントを発生さの両方readystateとload。またはコールバックでクリーンアップを行う。しかし、script要素を持っていない非常にではありません周囲には無害です。）encodeURIではなく、encodeURIComponentも使用する必要があります。head要素の必要はありません。スクリプトを直接document.documentElementに追加することができます。

出典

2011-12-16 12:31:01

このスクリプトは、文法的に与えられたsrc URLで<script/> HTMLタグを作成し、ページのDOMにおける<head>の先頭に追加し：

<head> 
    <script src="https://services.postcodeanywhere.co.uk/PostcodeAnywhere/Interactive/FindByPostcode/v1.00/json.ws?&Key=...&Postcode=...&Postcode="></script> 
    <!-- the rest of the HEAD --> 
</head>

それはまたにイベントハンドラをアタッチonloadとonreadystatechangeです。このイベントは、スクリプトがロードされるとトリガーされます。興味深いことに、それがロードされるとイベントハンドラと<script/>タグが削除され、それ自体の後でクリーンアップされます。

おそらくスクリプトは、その副作用のためにダウンロードされた直後にいくつかのコードを実行します。例えば。グローバルオブジェクトを作成するか、DOMを変更します。スクリプトが完了すると、何らかの理由でスクリプトが削除されます。

出典

2011-12-16 12:24:24

1）それがDOM要素を作成し、

2）このように、それをダウンロードし、ヘッド素子にそれを置きます。

3）

4実行）は、DOM要素を削除します。任意のグローバル関数と変数が後で利用可能になること

注、それが除去された後にそれからコードを実行することができ、変数がアクセスされます。

出典

2011-12-16 12:26:31

このJavaScriptの仕組みはどのように機能しますか？

答えて

関連する問題