1.最原始的js ,new XMLHttpRequest(); //由于浏览器兼容的原因,代码复杂,多使用基于jQuery的异步请求方法(内部封装)
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码,创建XMLHttpRequest对象
xmlhttp = new XMLHttpRequest();
}else{
// IE6, IE5 浏览器执行代码,创建ActiveXObject对象
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
// 每当 readyState 改变时,就会触发 onreadystatechange 事件
xmlhttp.onreadystatechange=function()
{
// readyState存有 XMLHttpRequest 的状态。从 0 到 4 发生变化
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
//服务器响应,responseText 属性返回字符串形式的响应;responseXML 属性返回XML的响应
document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
}
}
//规定请求的类型、URL 、是否异步处理请求(ture或false)
xmlhttp.open("GET", "/try/ajax/ajax_info.txt", true);
//发送请求
xmlhttp.send();
}
2.基于jQuery的Ajax方法:
(1)$.ajax(),实例如下:
$.ajax({
// 请求方式为get或者post等
type: "GET",
// 服务器响应的数据类型
dataType: "json",
// 请求的url(一般为后台接口)
url: "test.json",
// 发送到服务器的参数,
data: {user:"xiao"},
// 请求成功后返回的数据,赋值给变量'data'
success: function(data){
// 对data进行操作
},
// 请求失败异常后,返回的错误信息
error: function(err){
}
});
(2)$.getJSON(url,[data],[callback]),实例如下:
$.getJSON("test.php", { name: "xiao" }, function(data){alert("JSON");});
(3)$.get(url,[callback]),实例如下://请求方式为get
$.get("test.php", function(data){alert("JSON");});
(4)$.post(url,[data],[callback]),实例如下://请求方式为post
$.post("test.php", { name: "xiao" }, function(data){alert("JSON");});
(5)load(url,[data],[callback]),实例如下:
$("#test").load("test.php",{limit:1},function(){alert("yes!");});
以上几种jquery的方法都等价于$.ajax()方法,除此之外还有其他的基于jQuery的异步请求方法。