javascript - 在没有 jQuery 的情况下使用 Ajax 更新页面的一部分

Question

该页面主要使用 PHP，仅少量使用任何 JavaScript，因此我不希望在没有 jQuery 的情况下使用它。我想更新页面的一部分，但我对 Ajax 不是很有经验。 jQuery 的方法是使用页面的 URL 后跟“#sectionid”。

Answer 1

您需要了解的所有信息都在这里:

https://developer.mozilla.org/en/XMLHttpRequest

您会对send、open、response、readyState 和onreadystatechange 感兴趣 文档部分。

onreadystatechange 将在请求的 readyState 更改时触发。在您的 readyState 更改为 done 后，您可以检查收到的响应。

确保打开时以异步模式打开。您不想通过发出同步 http 请求来卡住您的页面。

如果你需要它在旧版本的 I.E. 上运行维基百科有一些很好的信息: http://en.wikipedia.org/wiki/XMLHttpRequest#Support_in_Internet_Explorer_versions_5.2C_5.5_and_6

我假设您知道如何使用 document.getElementById 和 element.innerHTML 来设置元素的内容。

---

编辑继续并添加一个基本实现:

if (window.XMLHttpRequest) {// IE7+, Firefox, Webkit, Opera
  window.xmlhttp = new XMLHttpRequest();
} else {// IE6, 5
  window.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.onreadystatechange = function() {
  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
     document.getElementById("someId").innerHTML = xmlhttp.responseText;
  }
}

xmlhttp.open("GET", "pageUrl", true);
xmlhttp.send();