ajax请求过程

最新推荐文章于 2023-12-28 20:58:37 发布

岁月如歌_

最新推荐文章于 2023-12-28 20:58:37 发布

阅读量197

点赞数

本文链接：https://blog.csdn.net/namechenfl/article/details/81807809

版权

ajax请求

<script type="text/javascript">
	function btnClick() {
		//创建核心对象
		xmlhttp = null;
		if (window.XMLHttpRequest) {// code for Firefox, Opera, IE7, etc.
			xmlhttp = new XMLHttpRequest();
		} else if (window.ActiveXObject) {// code for IE6, IE5
			xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
		}
		//编写回调函数
		xmlhttp.onreadystatechange = function() {
			if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
				alert(xmlhttp.responseText)
			}
		}
		//open设置请求方式和请求路径
		xmlhttp.open("get", "www.baidu.com");//一个servlet，后面还可以写是否同步
		//send 发送
		xmlhttp.send();
	}
</script>

ajax封装

/*function ajax(type,url,fnSucess,fnFail,data){
	//对于非必须参数的处理
	//考虑参数过多的情况
	xhr.open(type,url,true)
}*/
//{type:"get",url:"demo.php",fnSuccess:foo,fnFail:bar,data:data}
//data{username:"aaaa",password:1111}=>"username=aaaa&password=1111"
function ajax(obj){
	
	var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
	var str = "";
	if(obj.data){
		for(var attr in obj.data){
			str += attr+"="+obj.data[attr]+"&";
		}
		str = str.replace(/&$/,"");
	}
	
	//避免传递的实参有小写的情形
	if(obj.type.toUpperCase() == "GET"){
		if(obj.data){
			xhr.open("get",obj.url+"?"+str,true);
		}else{
			xhr.open("get",obj.url,true);
		}
		xhr.send();
	}
	if(obj.type.toUpperCase() == "POST"){
		xhr.open("post",obj.url,true);
		xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
		xhr.send(str);
	}
	
	xhr.onreadystatechange = function(){
		if(xhr.readyState == 4){
			if(xhr.status == 200){
				var data = xhr.responseText;
				obj.fnSuccess(data);
			}else{
				obj.fnFail();
			}
		}
	}
	
}