ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery 非同期オブジェクト (XMLHttpRequest)_JavaScript スキルに関する簡単な説明

jQuery 非同期オブジェクト (XMLHttpRequest)_JavaScript スキルに関する簡単な説明

WBOY
WBOYオリジナル
2016-05-16 16:31:081500ブラウズ

まず、非同期オブジェクトの 5 つのステップを見てみましょう

これは郵送でリクエストされます。

コードをコピーします コードは次のとおりです:

//1.00非同期オブジェクトの作成
var xhr = new XMLHttpRequest();
//2.0
xhr.open("post", url,params, true);
//3.0 は Formdata 属性を使用してパラメータを渡します
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
//4.0 コールバック関数を設定します
xhr.onreadystatechange = function () {
If (xhr.readyState == 4 && xhr.status == 200) {
アラート(xhr.responseText);
}
}
//5.0パラメーターの合格
xhr.send(params);

get リクエストを結合して非同期オブジェクト パッケージを作成します

リクエストで

取得

xhr.setRequestHeader("If-Modified-Since", "0"); キャッシュをクリアします

そして投稿リクエスト

コードをコピーします コードは次のとおりです:

xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

送信方法についてです
in
の型は、application/x-www-form-urlencoded
を含む 3 つの方法で取得できます。

コードをコピー コードは次のとおりです:

var ajaxHelp = {
    CreatXHR: function () {
        //创建异步对オブジェクト
        var xhr = 新しい XMLHttpRequest();
        xhr を返します;
    }、
    //ajax の get 要求
    AjaxGet: 関数 (url, callBack) {
        this.AJaxCommon("get", url, null, callBack);
    }、
    //ajax の投稿要求
    AjaxPost: 関数 (url、params、callBack) {
        this.AJaxCommon("post", url, params, callBack);
    }、
    AJaxCommon: 関数 (メソッド、URL、パラメータ、コールバック) {
        //1.0
        var xhr = this.CreatXHR();
        //2.0
        xhr.open(メソッド, URL, true);
        //3.0
        if (メソッド == "get") {
            xhr.setRequestHeader("If-Modified-Since", "0");
        } else {
            xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        }
        //4.0
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
                var data = JSON.parse(xhr.responseText);
                //実行回调関数
                callBack(データ);
            }
        }
        //5.0
        xhr.send(params);
    }
};

ps: JQuery のページには $.ajax や $.get / $.Post などのメソッドがあります。以前のカプセル化は使用されません。 JQuery は、さまざまなツールの互換性を理解するためにすでに存在しています

以上は、jQuery オブジェクト (XMLHttpRequest) についての理解です。問題がある場合は、システムを麻痺させてください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。