そして、Ajaxリクエストを処理する方法

1. Ajaxは何ですか

私は、Ajaxは、データの非同期要求であることを理解します。AJAXは、主ブラウザXMLHttpRequestオブジェクトによって提供される依存して、このオブジェクトは、HTTPのような機能は、ブラウザがサーバとページが更新されない場合に交換データを有効に、HTTP要求および応答を受信することができました。

2、どのようにネイティブJSのAJAX要求

5つの重要なステップがあります:(）
（1）XMLHttpRequestオブジェクトを作成します

var xhr = new XMLHttpRequest()

（2）要求を開始します

xhr.open('GET/Post','url',ascyn) 

（3）リクエストを送信し、この時間は、要求されたデータを取得できるようにします

xhr.send()

（4）データを取得するためには、同期および非同期に分割されています

ときに、同期データ収集

var data = xhr.responseText
console.log(data) 

短所：要求は特に低速なネットワークがある場合は、ページ要求は、ユーザが操作することができないデータのためにこだわって待っています。だから我々は唯一の非同期方式（同期を推奨しません）することができます。

場合は、非同期のデータ取得

//监听数据，内部数据到了会触发load
 xhr.addEventListener('load', function () {
    // 如果响应状态是200到300以内，或者等于304
    // 200到300都是请求数据成功的
    // 304 重定向（缓存）
    if((xhr.status >= 200 && xhr.status < 300) || xhr.status === 304){
      //responseText：响应文本（内容）
      var data = xhr.responseText
      console.log(data)
    }else{
      console.log('出错了')
    }
 }

コードが劣らコードの実行速度の要求されたデータレートよりも、トップダウンから実行されるので、データの到着を監視するために必要ではありません

最後に、完全な文言は次のようになります。

var xhr = new XMLHttpRequest()
xhr.open('GET', 'http://hello.php', true)
xhr.onreadystatechange = function(){
    if(xhr.readyState === 4) {
        if((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304){
            //成功了
            console.log(xhr.responseText)
        } else {
            console.log('服务器异常')
        }
    }
}
xhr.onerror = function(){
    console.log('服务器异常')
}
xhr.send()

2、AJAXを使用するには、どのようにjqueryの

$.ajax({
            url:"/user/login",//url地址
            dataType:"json",//返回的数据类型
            type:"post",//发起请求的方式,get/post
            data:{//此处为请求的参数
                'name':name,
                'password':password
            },
            success:function(data) {
            //请求成功时，执行
            console.log(data)//后端接口返回的参数
            },
            error:function(){
            //请求失败时，执行
            }
        });