Question

我看到W3school中的大多数AJAX示例都是这样的：

function loadDoc() {
    var xhttp = new XMLHttpRequest();
    xhttp.open("GET", "ajax_info.txt", true);
    xhttp.send(); //send request
    xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
            document.getElementById("demo").innerHTML = xhttp.responseText; //get response
        }
    };
}

我改变了代码的顺序：

 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT)
 {
    WebView.setWebContentsDebuggingEnabled(true);
 }

它似乎也有效，我的大脑会再考虑第二个逻辑。

所以我的问题是：这个AJAX代码的顺序是否有任何规则？在任何情况下，它会对上面的两个例子产生任何不同吗？

Answer 1

AJAX请求是异步处理的，因此回调定义的顺序无关紧要。

我已经用一些注释注释了你的代码。执行顺序（在本例中）为：

1 -> 2 -> 3 (Request Triggered) -> 4 (Define callback)
          |
          5 (Callback function called asynchronously every time the request state changes)
          |
          6 Execute logic if request is successful

步骤1（创建XHR对象），2（打开请求）和3（发送请求）必须按顺序进行。只要在网络响应或状态发生变化发生之前，步骤4就可以在创建对象后的任何时间发生。

阅读JS中的AJAX和异步回调将有助于更好地理解这一点。你可以start here。

＆＃13;

function loadDoc() {
  //1. Create XHR Object
  var xhttp = new XMLHttpRequest();
  
  //2. Define request parameters
  xhttp.open("GET", "ajax_info.txt", true);
  
  //3. Trigger Request
  xhttp.send();
  
  //4. Define callback for state change
  xhttp.onreadystatechange = function() {
  //5. This code is executed every time the state of the request changes
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      //6. This code executes only if readyState is 4 (request is done) and the http status is 200 (success)
      document.getElementById("demo").innerHTML = xhttp.responseText; //get response
    }
  };
}

＆＃13;

AJAX代码顺序的区别

1 个答案: