1.ajax原生
ajax包括以下几步骤:1、创建AJAX对象;2、发出HTTP请求;3、接收服务器传回的数据;4、更新网页数据。概括起来,就是一句话,ajax通过原生的XMLHttpRequest对象发出HTTP请求,得到服务器返回的数据后,再进行处理。
步骤:var xhr = createXHR();//创建对象
xhr.open(“方式”,”地址”,”标志位”);//初始化请求
xhr.setRequestHeader(“”,””);//设置http头信息
xhr.onreadystatechange =function(){}//指定回调函数
xhr.send();//发送请求/ //1.创建xhr对象
var xhr;
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest();
}else{
xhr = new ActiveXObject('Microsoft.XMLHTTP');
}
//异步接受响应
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
if(xhr.status == 200){
//实际操作
;
}
}
}
//发送请求
xhr.open('get',url,true);
xhr.send();
2.jquery封装ajax$.ajax({
type : "get",
url : '',
dataType : "json",
data:{},
success : function(data){
},error:function(){
console.log('fail');
}
});
3.jsonp跨域原理
出于安全性考虑,浏览器禁止ajax跨域获取数据
逐步演示script的src属性加载js文件的方式获取数据
解释跨域获取数据的机制
(1)动态创建script标签
(2)定义回调函数
(3)返回函数调用
(4)传递参数或者全局变量
原生Ajax与jQuery封装:实战跨域JSONP
本文详细解析了原生Ajax的工作原理,并展示了如何使用jQuery简化Ajax请求,重点介绍了跨域获取数据的JSONP技巧。从创建xhr对象到使用jQuery的$.ajax方法,以及跨域原理的演示,适合前端开发者深入理解Ajax技术。
1221

被折叠的 条评论
为什么被折叠?



