1.AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。
2.AJAX = 异步 JavaScript 和 XML。
3.AJAX 是一种用于创建快速动态网页的技术。
4.AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等
一 对象的创建
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
二 异步判断
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
}
三 XMLHttpRequest 对象的 responseText 或 responseXML 属性
- document.getElementById("myDiv").innerHTML=xmlhttp.responseText;//获得字符串形式的响应数据
- xmlDoc=xmlhttp.responseXML;//获得 XML 形式的响应数据
txt="";
x=xmlDoc.getElementsByTagName("ARTIST");
for (i=0;i<x.length;i++)
{
txt=txt + x[i].childNodes[0].nodeValue + "<br />";
}
document.getElementById("myDiv").innerHTML=txt;
四 向服务器发送请求
xmlhttp.open("method "," url ", async);
xmlhttp.send(string);
method:请求的类型;GET 或 POST
url:文件在服务器上的位置
async:true(异步)或 false(同步)
只有当method设置post时,send用string
五。通过jQuery实现加载后台数据
$("div").load(URL,data,callback)
必需的 URL 参数规定您希望加载的 URL。
可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。
可选的 callback 参数是 load() 方法完成后所执行的函数名称。
callback的用法
$("button").click(function(){
$("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){
if(statusTxt=="success")
alert("外部内容加载成功!");
if(statusTxt=="error")
alert("Error: "+xhr.status+": "+xhr.statusText);
});
});
$.get(URL,callback);
必需的 URL 参数规定您希望请求的 URL。
可选的 callback 参数是请求成功后所执行的函数名。
$.post(URL,data,callback);
必需的 URL 参数规定您希望请求的 URL。
可选的 data 参数规定连同请求发送的数据。
可选的 callback 参数是请求成功后所执行的函数名。