Asynchronous JavaScript and XML
异步的 JavaScript 和 XML
是一种用于创建快速动态网页的技术
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。
这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新
XMLHttpRequest 是 AJAX 的基础,所以先要了解 XMLHttpRequest
XMLHttpRequest 是一个 个浏览器接口,使得Javascript可以进行HTTP(S)通信。
我们使用XMLHttpRequest对象来发送一个Ajax请求
//判断浏览器是否支持 XMLHttpRequest 对象
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest(); // 创建一个 XMLHttpRequest对象
} else { // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); // 创建ActiveXObject对象
}
//每当 readyState 属性改变时,就会调用该函数
xmlhttp.onreadystatechange = function() {
// 当 readyState 等于 4 且状态为 200 时,表示响应已就绪
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
// 获得字符串形式的响应数据并渲染dom
document.getElementById("mydiv").innerHTML = xmlhttp.responseText;
}
}
规定请求类型为 GET,url地址为test.html,并且是异步的
xhr.open("GET","test1.html",true);
将请求发送到服务器
xhr.send();
如需获得来自服务器的响应,请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。
属性————描述
responseText————获得字符串形式的响应数据。
responseXML————获得 XML 形式的响应数据。
如果来自服务器的响应并非 XML,请使用 responseText 属性。
responseText 属性返回字符串形式的响应
如果需要像 HTML 表单那样 POST 数据,请使用 setRequestHeader()
来添加 HTTP 头。然后在 send()
方法中规定您希望发送的数据:
xmlhttp.open("POST","ajax_test.asp",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("fname=Bill&lname=Gates");
setRequestHeader(header,value)
向请求添加 HTTP 头
header: 规定头的名称
value: 规定头的值
相关文章推荐: