3

你们能告诉我ajax浏览器后面发生了什么吗...我只知道不刷新页面所有数据都已加载...

这是我的代码

<script>
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();
}
</script>
4

1 回答 1

6

当您发出 AJAX 请求时，您的浏览器会向给定地址发送 HTTP 请求。请求另一端的服务器做出响应，并将数据返回给您的浏览器。这与您导航到新网页时发生的事情相同。

AJAX 的不同之处在于，它不是导航到新页面并直接显示它，而是获取响应数据并将其封装在 JavaScript 变量中。然后可以使用 JavaScript 操作此变量并动态插入到您的页面中。

就是这样！唯一可能对您来说有点神秘的是这行：

xmlhttp.onreadystatechange=function()

它的作用是将事件附加到xmlhttp对象，该对象实际执行请求。每次对象的“就绪状态”更改时都会触发该事件。“就绪状态”是请求状态的一种状态指示器。AJAX 请求一般会经历五个阶段：

  • 未发送 (0)
  • 已打开 (1)
  • HEADERS_RECEIVED (2)
  • 正在加载 (3)
  • 完成 (4)

在请求达到“完成”阶段之前，您的数据不可用。通过检查就绪状态代码 4，您实际上是在检查请求是否已完成。请注意，在某些浏览器中，您还可以使用上面定义的常量来检查状态，但是因为这些常量并不是在所有浏览器中都通用定义的（Opera 是一个明显的例外），但最好还是坚持检查数字代码。

还值得一提的是，并非所有的浏览器都必须访问所有就绪状态。代码 4 几乎是一个安全的选择，但一些较早的代码并不总是被实施。本文对该主题进行了更深入的探讨：http: //www.ibm.com/developerworks/web/library/wa-ajaxintro3/。

与就绪状态代码一起检查的另一件事是 HTTP 状态代码。您检查它是否等于 200，因为代码 200 表示请求正常执行。当请求未成功完成时，其他代码将返回给您。可以在此处找到 HTTP 代码列表http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html。

于 2012-11-24T14:02:33.230 回答