这次给大家带来Ajax与$.ajax实例详解，Ajax与$.ajax使用的注意事项有哪些，下面就是实战案例，一起来看一下。

实例一(Ajax请求基本创建格式)：

Ajax练习(GET，不考虑浏览器兼容性)

function doRequest() {

//不考虑浏览器兼容性问题

var xmlHttp = new XMLHttpRequest();

//打开一个与Http服务器的连接

xmlHttp.open("GET", "Default.aspx", true);

//与服务器端交互

xmlHttp.send(null);

//监听服务器端响应状态的改变事件

xmlHttp.onreadystatechange = function () {

//客户端与服务器端交互完成

if (xmlHttp.readyState == 4) {

//服务器端返回Http状态码：200表示请求成功,404未找到,403错误

if (xmlHttp.status == 200) {

//获得服务器端资源

var result = xmlHttp.responseText;

alert(result);

}

}

}

}

AjaxDemo实例

//使用Ajax读取浏览器的工作内容

function readRequest() {

//不考虑浏览器的兼容性问题

var xmlhttp = new XMLHttpRequest();

//打开一个与服务器相关的链接

//发送请求

//请求的方式(获取/发送)，请求页面，是否异步

xmlhttp.open("GET", "AjaxDemo.aspx", true);

//发送数据

xmlhttp.send(null);

//接受服务器返回结果

xmlhttp.onreadystatechange = function() {

//请求完成

if (xmlhttp.readyState == 4) {

//链接成功

if (xmlhttp.status == 200) {

//输出浏览器的内容

var result = xmlhttp.responseText;

alert(result);

window.alert("读取浏览器的内容成功！");

}

}

};

};

function btn_Click() {

var http = new ActiveXObject("Microsoft.XMLHTTP");

//或者使用这一句创建 var xmlhttp = new XMLHttpRequest();

if (!http) {

alert("创建xmlhttp对象异常！");

return false;

}

http.open("POST", "AjaxDemo.ashx", false);

http.onreadystatechange = function() {

if (http.readyState == 4) {

//链接成功

if (http.status == 200) {

alert(http.responseText);

document.getElementById("Text1").value = http.responseText;

} else {

window.alert("Ajax服务器返回错误！");

}

}

};

http.send();

};

实例二(见附件)

考虑浏览器兼容性Ajax请求处理，获取后台xml文件内容。

实例三(见附件)

使用$.Ajax获取后台读取xml文件内容信息。function readXML1() {

//创建XML对象

var xmldom = new ActiveXObject("Microsoft.XMLDOM");

//设置为异步

xmldom.async = "false";

//加载需要读取的XML文档

xmldom.load("XML1.xml");

info = "";

//需要读取的根节点

var node = xmldom.selectNodes("student");

//依次读取其中的内容

info = node[0].childNodes[0].nodeTypedValue + "
" + node[0].childNodes[1].nodeTypedValue+ "
" + node[0].childNodes[2].nodeTypedValue;

document.getElementById("xmlmsg").innerHTML = info;

};function readXML2() {

//实例化xml对象

var xml = new ActiveXObject("Microsoft.XMLDOM");

//异步设置

xml.async = "false";

//加载需要读取的XML文档

xml.load("XML2.xml");

info = "";

//选择需要读取的对象名称

var fnode = xml.documentElement.selectNodes("people");

//循环输出文档的内容

for (var i = 0; i < fnode.length; i++) {

for (var j = 0; j < fnode[i].childNodes.length; j++) {

info += fnode[i].childNodes[j].text + "
";

}

}

document.getElementById("xmlmsg").innerHTML = info;

};

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：