原生ajax

233 阅读1分钟
很多js库会对ajax进行封装,我们直接调用即可,即使不理解其原理也能顺利完成接口调用功能,但是我们还是需要了解他的底层原理。
话不多说,直接上代码:

我们首先要确定浏览器的类型,是IE还是非IE浏览器

var XHR = null;

if(window.XMLHttpRequest) {
	XHR = new XMLHttpRequest()
} else if (window.ActiveXObject) {
	XHR = new ActiveXObject('Mircosoft.XMLHTTP')
}

GET请求:

if(XHR) {
	XHR.open('GET''http://www.baidu.com', true)
	XHR.onreadystatechange = function () {
		if(XHR.readySate == 4 && XHR.status == 200) {
			consle.log(XHR.responseText)
		}
	}
	XHR.send()
}

POST请求:

if(XHR) {
	XHR.open('POST', 'http://www.baidu.com', true);
	XHR.setRequestHeader('Content-Type','application/x-www-form-urlencoded; charset=urf-8')

	XHR.send('password=123444')
	
	XHR.onreadystatechange = function () {
		if(XHR.readyState == 4 && XHR.status == 200) {
			console.log(XHR.responseText)
		}
	}
}