ajax

最新推荐文章于 2025-05-14 10:58:21 发布

XGTX1998

最新推荐文章于 2025-05-14 10:58:21 发布

阅读量52

点赞数

本文链接：https://blog.youkuaiyun.com/qq_44950078/article/details/115244023

版权

关键词由优快云通过智能技术生成

本文深入探讨了原生Ajax和jQuery中的Ajax实现方式，包括xhr对象的创建、请求的建立、设置请求头、发送数据以及响应的监听。重点阐述了两者在处理HTTP请求和响应时的异同，对于理解前端数据交互具有重要意义。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、原生ajax

1、实例化xhr

var xhr=new XMLHttpRequest

2、建立连接

xhr.open(请求方式，请求地址）

3、设置请求体

xhr.requestHeader('Contet-Type','application/x-www-form-urlencoded')//查询字符串
xhr.requestHeader('Contet-Type','application/json')//json字符串
查询字符串
	key1=val1&key2=val2&......
json字符串
	’{'name':tom
对象序列化

4、发送请求

	xhr.send([data])

5、监听响应

xhr.onreadystatechange=function(){
	//请求是否成功发送
	if(xhr.readystate==4){
			//是否成功拿到响应结果
			if (xhr.states==200){
			}
	}
}

2、jQuery中的ajax

ajax({
	url:' ',
	method:' ',
	contentType:'application/json '    //只有参数是json字符串的时候才需要设置，默认参数是查询字符串
	[data]:obj    //查询字符串
	[data]:JSON.stringify(obj)    //json字符串
	success:function(res){}
	error:function(){}
})