3

ブラウザの背後で ajax で何が起こっているのか教えてもらえますか... ページを更新しなくてもすべてのデータが読み込まれていることがわかります....

ここに私のコードがあります

<script>
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();
}
</script>
4

1 に答える 1

6

AJAX リクエストを行うと、ブラウザは特定のアドレスに HTTP リクエストを送信します。リクエストの相手側のサーバーが応答し、データをブラウザに返します。これは、新しい Web ページに移動したときに発生するのと同じことです。

AJAX の違いは、新しいページに移動してそのまま表示するのではなく、応答データを取得して JavaScript 変数に含めることです。その後、この変数を JavaScript で操作して、ページに動的に挿入できます。

それはそれについてです！あなたにとってやや謎のままかもしれない唯一のものは、次の行です。

xmlhttp.onreadystatechange=function()

xmlhttpこれが行うことは、実際にリクエストを実行するオブジェクトにイベントを添付することです。イベントは、オブジェクトの「準備完了状態」が変化するたびに発生します。「準備完了状態」は、リクエストの状態を示す一種のステータス インジケータです。AJAX リクエストは通常​​、次の 5 つの段階を経ます。

  • 未送信 (0)
  • 開いた (1)
  • HEADERS_RECEIVED (2)
  • ローディング (3)
  • 完了 (4)

リクエストが「DONE」段階に達するまで、データは使用できません。準備完了状態コード 4 を確認することで、リクエストが完了したことを効率的に確認できます。一部のブラウザーでは、上記で定義された定数を使用して状態を確認することもできますが、定数はすべてのブラウザーで普遍的に定義されているわけではないため (Opera は顕著な例外です)、数値コードの確認に固執することをお勧めします。

また、すべてのブラウザから必ずしもすべての準備完了状態にアクセスできるわけではないことにも注意してください。コード 4 はほぼ安全な賭けですが、以前のコードの一部は常に実装されているわけではありません。http://www.ibm.com/developerworks/web/library/wa-ajaxintro3/の記事では、この件についてもう少し詳しく説明しています。

準備完了コードと一緒に確認するもう 1 つのことは、HTTP ステータス コードです。コード 200 は要求が正常に実行されたことを意味するため、200 であることを確認します。リクエストが正常に完了しなかった場合は、他のコードが返されます。HTTP コードのリストは、http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.htmlにあります。

于 2012-11-24T14:02:33.230 に答える