创建一个请求需要三个步骤:
1.创建一个XMLHttpRequest对象的引用
2.调用open()方法
3.调用send()方法
function createAjax(){
if(window.ActionXObject){ //对IE6,7,8兼容
return new ActiveXObject("Microsoft.XMLHTTP")
} else {
return new XMLHTTPRequest()
}
}
function getContent(url,callback){
var xhr = createAjax()
xhr.open("GET",url)
xhr.onreadystatechange = function(){
if(xhr.readyState === 4 && xhr.status === 200){
callback(xhr.responseText)
} else {
return xhr.status
}
}
xhr.send()
}
function handleData(data){
//回调函数,处理数据
}
这是一个最简单的ajax请求。中间的onreadystatechange是事件处理程序。即监听请求的进度,完成响应后,怎么处理返回的内容,callback回调函数就是处理返回内容的函数。
ajax重要的5个值,即readyState的值:
- 0:未初始化。尚未调用open()方法
- 1:启动。已经调用open()方法,但尚未调用send()。
- 2:发送。已经调用send()方法,但尚未接收到响应。
- 3:接收。已经接收到部分响应的数据。
- 4:完成。已经接收到全部响应数据,并且已经可以在客户端使用。
JSON数据格式:
var text = {
"sites" : [
{ "name":"Runoob" , "url":"www.runoob.com" },
{ "name":"Google" , "url":"www.google.com" },
{ "name":"Taobao" , "url":"www.taobao.com" }
]
};
因为json数据格式是键值对的形式,键/ 值都为字符串,而我们需要把它装换为对象的形式才能正常使用,
通过JSON.parse()转换之后就是这样的形式,这时我们就可以将他们当做正常的对象进行访问。
function callback(res){
console.log(res.data.slider[0].linkUrl)
}
此时就会将第一条linkUrl打印出来。