1. ajax の概要
1. Ajax は、Asynchronous ([ə'sɪŋkrənəs]) JavaScript XML の略称であり、新しい技術ではなく、既存の技術を総合的に活用したものです。このテクノロジーは、ページを更新せずにサーバーに追加データを要求できるため、ユーザー エクスペリエンスが向上します
2. Ajax テクノロジーの中核は、Microsoft によって初めて導入された機能である XMLHttpRequest オブジェクト (略して XHR) です。 XHR が登場する前は、Ajax スタイルの通信を実現するには、主に隠しフレームまたはインライン フレームを使用するいくつかのハックを使用する必要がありました。
3. XHR は、サーバーにリクエストを送信し、サーバーの応答を解析するためのスムーズなインターフェイスを提供します。サーバーからより多くの情報を非同期的に取得できるということは、ユーザーがクリックした後、ページを更新せずに新しいデータを取得できることを意味します。つまり、ページの更新を使用してサーバーからデータを取得できますが、必ずしも XML データであるとは限りません
2. 操作: ネイティブ ajax と jQuery にカプセル化された ajax
1. ネイティブ ajax:
ajax 関数: を送信します。 request (set request setRequest) 応答の受信 (getResponse)
A、Ajax ネイティブのリクエスト送信方法:
Ajax の最も重要で固定された部分は http リクエストです。
1) 接続を確立します: (IE7 以降のバージョンは XMLHttpRequest をサポートします)
var xhr = new XMLHttpRequest(); //非同期リクエスト オブジェクトを作成します
2) リクエストの取得: 形式は (url?name1=value1&name2 である必要があります) =value2 )
1 2 |
|
3) Post リクエスト
1 2 3 |
|
4) get リクエストと post リクエストの違い:
★get はリクエスト ヘッダーを設定する必要はありませんが、post はリクエスト ヘッダーを設定する必要があります。リクエストヘッダー
★データの取得 転送は URL を通じて行われ、投稿データは send メソッドで渡されます
B. Ajax ネイティブの方法で応答を受信します:
1 2 3 4 5 6 7 8 9 |
|
C. data:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
|
1 2 3 4 5 6 7 8 9 |
|
3. レスポンス
3) status: サーバーの応答コード
共通レスポンス コード: 200 — サーバーは Web ページに正常に戻りました。 404 — リクエスト Web ページが存在しません。