JQuery Ajaxリクエスト

1. Ajax の概要:

Webアプリケーションでサーバーに非同期リクエストを送信し、非同期レスポンスを受信する技術で、主な実装プロセスは以下の通りです。

1. ブラウザ内の JS がサーバーにリクエストを送信します

2. サーバーはブラウザ内の JS に応答情報を送信します

3. JSはDOMを通じてブラウザの一部を操作します

補足:DOM(ドキュメントオブジェクトモデル、Document Object Model)について。これは、プログラムやスクリプトに動的にアクセスできる、プラットフォームや言語に依存しないアプリケーション プログラミング インターフェイス (API) です。

2. JQuery Ajax の概要:

JQuery 環境で Ajax テクノロジーを使用することで、すべてのページをリロードすることなく Web コンテンツの部分更新を実現します。

補足:JQueryと組み合わせると、単純にAjaxを使用するよりもページの更新が便利になります。

3. JQuery テクノロジーで一般的に使用されるパラメーター:

1. url: 送信するURLを指定します

2. data: サーバーに送信されるデータ

3. dataType: 予想されるサーバー応答のデータ型

4. asybc: 非同期または同期リクエスト、値は TRUE または FALSE、デフォルトは TRUE

5. success(): リクエストが成功したときに実行される関数

6. beforeSend(xhr): 送信

補足: xhr の正式名称は XMLHttpRequest で、サーバーとデータをやり取りするために使用される、ajax の機能が実装されたオブジェクトであり、jquey における Ajax は xhr をカプセル化したものです。

XMLHttpRequest オブジェクトは、通常の GET リクエストだけでなく、POST および HEAD リクエストを行う機能を含む、HTTP プロトコルへの完全なアクセスを提供します。XMLHttpRequest は、Web サーバーの応答を同期または非同期で返すことができ、コンテンツをテキストまたは DOM ドキュメントの形式で返すことができます。

7. キャッシュ: ブラウザーが要求されたページをキャッシュするかどうかを示すブール値。デフォルトは true です。

8. complete(xhr,status): リクエストが完了したときに実行される関数 (リクエストが成功または失敗した後、つまり、success() 関数と error() 関数の後に呼び出されます)。

9. contentType: サーバーにデータを送信するときに使用されるコンテンツ タイプ。

デフォルト: 「application/x-www-form-urlencoded」。

10. context: バックエンドのコンテキストにリンクされます。ajax のコールバック関数の "this" に相当します。

11. dataFilter(data,type): フィルター、XMLHttpRequest の元の応答データを処理する関数。

12. globl: ajax イベントのリクエストがグローバルにトリガーされるかどうかを指定します。デフォルト値は true です。

13. ifModified: 最後のリクエスト以降に応答が変更された場合にのみリクエストが成功するかどうかを指定します。デフォルトは false です。

14. jsonp: コールバック関数の文字列を jsonp に書き換えます。

15. jsonpCallback: jsonp でコールバック関数の名前を指定します。

16. HTTP アクセス認証リクエストで使用するパスワードを指定します。

17. processData: リクエストを通じて送信されたデータをクエリ文字列に変換するかどうかを指定します。デフォルトは true です。

18. scriptCharset: 要求された文字セットを指定します。

19. timeout: ローカルリクエストのタイムアウトを設定します。

20. Traditional: 従来のスタイルのパラメータシリアル化を使用するかどうかを指定します。

21. type: リクエストのタイプ (GET または POST) を指定します。

22. username: HTTP アクセス認証リクエストで使用されるユーザー名を指定します。

23. パスワード: HTTP アクセス認証リクエストで使用されるパスワードを指定します。

24. xhr: XMLHttpRequest オブジェクトを作成するために使用される関数。

5、jquery における ajax と axios の違い:

1. Ajax はネイティブ XHR (xmlHttpReqest) のカプセル化であり、axios は Promise ベースの HTTP ライブラリです。

2. Ajax テクノロジーは部分データのリフレッシュを実現し、axios は ajax のカプセル化を実現します。

簡単に言うと、jQuery はリクエスト テクノロジーを ajax にカプセル化し、ajax テクノロジーは Web ページの部分的なデータ更新を実現し、さらに promis を通じて ajax を axios にカプセル化します。

補足: ajax ではなぜ axios を作成するのか:

Axios は、フロントエンド mvvm モードでのデータ要求により適しています。

Ajax は、MVC 構造プロジェクトのデータ要求により適しています。

おすすめ

転載: blog.csdn.net/zhan_qian/article/details/128359853