XMLHttpRequest 读取 XML 数据时显示 responseXML 为 null

背景：

在网站建设过程中，XML可以将数据从 HTML 文档中分离出来，所谓分离，就是在 HTML 中仅仅编写与页面相关的程序，而网站中的数据则储存在 XML 文档中，这种方法把程序和数据分离开来，使得文档更为清晰。当 HTML 需要调用 XML 中的数据时，通过 JAVASCRIPT 或者 JQUERY 语言实现。

问题：

编码完成后，页面上没有显示数据，增加语句 alert (XMLHttpRequest().responseXML)，提示为 null。

分析：

看到 null，第一反应是数据没有请求成功，有可能是 open() 或者 send() 出了问题。设置 console.log(xmlhttp.readyState) 和 console.log(xmlhttp.status) 显示代码分别为 1 和 0，1 表示 open() 方法已经被调用，0 的含义不是特别清楚，据说是 status 返回代表运行步骤的结果，总之是没有调用数据，如果成功调用，status 应该显示为 200。

除了 XMLHttpRequest().responseXML 显示 null，后续的报错为：

Uncaught TypeError: Cannot read property 'getElementsByTagName' of null

以上的信息显然表明 XMLHttpRequest().responseXML 没有正确读取数据。

解决：

查了很多案例，在源代码中增加函数，其目的是引入属性 onreadystatechange，用以判断请求状态，代码类似于：

XMLHttpRequest().onreadystatechange = function () {

if (XMLHttpRequest().readyState == 4 && XMLHttpRequest().status == 200) { 执行代码}

}

增加此段代码后数据调用成功，且 alert (XMLHttpRequest().responseXML) 显示 [object XMLDocument]。

总结：

利用 AJAX 请求调用数据是有顺序的，执行代码必须在请求成功后才能执行，否则将导致 null 的情况，因此需要引入属性 onreadystatechange 以判断请求是否成功。