使用没有jQuery的Ajax更新页面部分

Question

该页面主要使用PHP，并且只使用任何JavaScript，因此我不希望在没有它的情况下使用jQuery。我想更新页面的一部分，但我对Ajax不是很熟悉。 jQuery的方法是使用页面的URL和“#sectionid”。

Answer 1

您需要知道的所有手动信息都在这里：

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

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

只要您的请求的readyState发生更改，

onreadystatechange就会触发。将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();