jQuery における Ajax の関連知識ポイントのまとめ

 // IE9 以上 // ​​const xhr = new XMLHttpRequest()
 // IE9 以下 // const xhr = new ActiveXObject('Mricosoft.XMLHTTP')

 // この互換性のある書き込み方法では、関数 createXHR() { をカプセル化する関数を使用できます。
 var 要求 = null;
 if (window.XMLHttpRequest) {
 // この XMLHttpRequest オブジェクトがある場合は、req = new XMLHttpRequest(); を使用します。
 } それ以外 {
 // それ以外の場合は、IE8 以降のメソッドを使用します req = new ActiveXObject("Microsoft.XMLHTTP");
 }
 返品要求;
 }
 // ステップ 1: ajax オブジェクトを作成する var xhr = createXHR(); // この方法で ajax オブジェクトを取得します // ステップ 2: ネットワーク要求情報を構成する xhr.open('get', './demo.php', true)
 // xhr.open('get/post', 'ネットワーク リクエストを送信するアドレス'、同期または非同期、デフォルトでは非同期の場合は true、同期の場合は false)
 // GET リクエストにパラメータがある場合は、アドレスの後に連結する必要があります (例: './demo.php?id=2&name=sanqi')
 // POST リクエストの場合は、パラメータを send() に配置する必要があります。例: xhr.send('id=2&name=sanqi')
 // ステップ 3: ネットワーク要求を送信する xhr.send() //
 // パート4: 応答ステータスを判別し、データを取得する xhr.onreadyStateChange = function () {
 // このイベントは readyState が変化するたびにトリガーされます // ここで readyState の値が 4 かどうかを確認します
 // httpステータスコードは200〜299です
 xhr.readyState === 4 の場合 && /^2\d{2|$/.test(xhr.status)) {
 // これは検証に合格したことを意味します // サーバーからの応答の内容を取得できます console.log(xhr.response);
 }
 }

<?php
ヘッダー('content-type:text/html;charset=utf-8;');
 $id = $_REQUEST['id'];
 $name = $_REQUEST['name'];
 $arr = [
 'id' => $id、
 '名前' => $名前
 ];
 json_encode をエコーし​​ます($arr);
?>

  $.get('./test.php','id=999&name=三七安',function (res) { 
  // 最初のパラメータは要求されたアドレスです // 2 番目のパラメータはサーバーに送信されるデータです // 3 番目のパラメータは成功した場合のコールバック関数で、サービスから返されるデータが含まれます // 4 番目のパラメータは取得するデータ形式です。json、text、html、xml、script などのオプションがあります
  コンソールログ(res);
  },'json')

	 $.post('./test.php',{id:123,name:'投稿リクエスト'},function (res) { 
	 // ここでのその他のパラメータは、get リクエストのものと同じです。 // ここで送信データをオブジェクト形式で書き込んでおり、リクエストは正常に送信できることに注意してください。つまり、get リクエストでも post リクエストでも、サーバーにデータを送信する場合は、文字列形式またはオブジェクト形式のいずれかを使用できます。 console.log(res);
  },'json')

 // $.ajax メソッドを使用します // 受け入れるパラメータはオブジェクト 1 つだけです。このオブジェクトは現在のリクエストのすべての構成を実行します。$.ajax({
  url: './ajax', // 必須、リクエストされたアドレス type: 'GET', // オプション、リクエストメソッド、デフォルトは GET (大文字と小文字を区別しない)
  data: {}, // オプション、リクエスト送信時に渡されるパラメータ dataType: 'json', // オプション、期待される戻り値のデータ型、デフォルトは文字列
  async: true, // オプション、非同期操作を有効にするかどうか、デフォルトは true
  success() {}, // オプション、成功時のコールバック関数 error() {}, // オプション、失敗時のコールバック関数 cache: true, // オプション、キャッシュするかどうか、デフォルトは true
  context: div, // オプション、コールバック関数内の this が指す、デフォルトは ajax オブジェクトです status: {}, // オプション、対応するステータス コードに従って関数を実行します timeout: 1000, // オプション、タイムアウト イベント })

$.ajax({
  タイプ: "get",
  URL: "./test.php"、
  データ： {
   id:000,
   name:'$.ajax リクエストを送信するデモ'
  },
  データ型: "json",
  成功: 関数 (応答) {
   console.log(応答);
  }
  });

$(window).ajaxStart(関数() {
 console.log('リクエストが開始されました')
})

$(window).ajaxSend(関数() {
 console.log('送信されようとしています')
})

$(window).ajaxSuccess(関数() {
 console.log('リクエストは成功しました')
})

$(window).ajaxError(関数() {
 console.log('リクエストが失敗しました')
})

$(window).ajaxComplete(関数() {
 console.log('リクエストが完了しました')
})

$(window).ajaxStop(関数() {
 console.log('リクエストが終了しました')
})