AJAX - XMLHttpRequest 对象

AJAX 的关键是 XMLHttpRequest 对象。

XMLHttpRequest 对象

所有现代浏览器都支持 XMLHttpRequest 对象。

XMLHttpRequest 对象可用于与后台服务器交换数据。这意味着可以更新网页的部分内容，而无需重新加载整个页面。

创建 XMLHttpRequest 对象

所有现代浏览器（Chrome、Firefox、Edge（和 IE7+）、Safari、Opera）都有一个内置的 XMLHttpRequest 对象。

创建 XMLHttpRequest 对象的语法：

variable = new XMLHttpRequest();

示例

var xhttp = new XMLHttpRequest();

亲自试一试 »

上面示例中使用的 "ajax_info.txt" 文件是一个简单的文本文件，如下所示：

<h1>AJAX</h1>
<p>AJAX is not a programming language.</p>
<p>AJAX is a technique for accessing web servers from a web page.</p>
<p>AJAX stands for Asynchronous JavaScript And XML.</p>

跨域访问

出于安全原因，现代浏览器不允许跨域访问。

这意味着网页和它尝试加载的 XML 文件必须位于同一服务器上。

91xjr 上的示例均打开位于 91xjr 域中的 XML 文件。

如果您想在您自己的网页之一上使用上面的示例，则您加载的 XML 文件必须位于您自己的服务器上。

XMLHttpRequest 对象方法

Method	Description
new XMLHttpRequest()	Creates a new XMLHttpRequest object
abort()	Cancels the current request
getAllResponseHeaders()	Returns header information
getResponseHeader()	Returns specific header information
open(method,url,async,user,psw)	Specifies the request method: the request type GET or POST url: the file location async: true (asynchronous) or false (synchronous) user: optional user name psw: optional password
send()	Sends the request to the server Used for GET requests
send(string)	Sends the request to the server. Used for POST requests
setRequestHeader()	Adds a label/value pair to the header to be sent

XMLHttpRequest 对象属性

Property	Description
onreadystatechange	Defines a function to be called when the readyState property changes
readyState	Holds the status of the XMLHttpRequest. 0: request not initialized 1: server connection established 2: request received 3: processing request 4: request finished and response is ready
responseText	Returns the response data as a string
responseXML	Returns the response data as XML data
status	Returns the status-number of a request 200: "OK" 403: "Forbidden" 404: "Not Found" For a complete list go to the Http Messages Reference
statusText	Returns the status-text (e.g. "OK" or "Not Found")