原生js ajax实现

  • 实例化XMLHttpRequet
    var request = new XMLHttpRequest();
  • 调用XMLHttpRequet对象的open方法,参数【方法,url】
    request.open("GET","data.scv");
    如果有请求头需设置请求头
    request.setRequestHeader("Content-Type","text/plain");
  • 向服务器发送请求
    request.send(null);//get请求没有请求主体,传null或者省略这个参数
    例子:
		//post发送文本给服务器
		function(msg) {
    		var request = new XMLHttpRequest();
    		request.open("POST","/log.php");
    		 request.setRequestHeader("Content-Type","text/plain;charset=UTF-8");
    		 request.send(msg)
    	}
  • 取得响应
    通过监听XMLHttpRequet对象上的readyState事件,readyState是一个整数,指定http请求状态。
    0 open()尚未调用
    1 open()已调用
    2 接收到头的信息
    3 接收到响应主体
    4 响应完成

    每次readyState都会触发readystatechange事件,实际上readystate改变为0或1时可能没有触发这个事件,

//发送get请求获得url内容
function getText(url){
	var request = new XMLHttpRequest();
	request.open("POST",url,false);//发送异步请求
	request.send(null);//立即发送请求
	if (request.status !== 200) {
		throw new Error("request.statusText");
	}
	var type = request.getResponseHeader("Content-type");
	if (!type.match(/^text/)) 
		throw new Error("Response Type is:" + type)
	return request.responseText;
}

猜你喜欢

转载自blog.csdn.net/qq_35014708/article/details/83718828