js ajax请求流程

<input type="button" name="btn" id="btn" value="按钮" />

JS

//点击按钮弹出1.txt的内容var oBtn=document.getElementById("btn");

oBtn.onclick=function(){
	//打开浏览器
	/*
	 1.创建一个ajax对象
	 	ie6以下new ActiveXObject(‘Microsoft.XMLHTTP‘)
	 * */
	var xhr=null;
	try{
		xhr=new XMLHttpRequest();
	}catch(e){
		xhr=new ActiveXObject(‘Microsoft.XMLHTTP‘);
	}
	//在地址栏中输入地址
	/*
	open方法
	 参数
	 	1.打开方式
	 	2.地址
	 	3.是否异步
	 		异步:非阻塞模式  前面的代码不会影响后面代码的执行
	 		同步:阻塞模式   前面的代码会影响后面代码的执行
	 * */     //异步请求
	xhr.open(‘get‘,‘1.txt‘,true);
	//提交  发送请求
	xhr.send();

	//等待服务器返回内容
	/*readyState:ajax工作状态 请求状态
	 * 0 (初始化)还没有调用open()方法
	 * 1 (载入)已经调用send()方法,正在发送请求
	 * 2 (载入完成)send()方法完成,已收到全部响应内容
	 * 3 (解析)正在解析响应内容
	 * 4 (完成)响应内容解析完成,可以在客户端调用了
	 *
	status属性:服务器(请求资源)的状态,http状态码
	返回的内容
		responseText:返回以文本形式存放的内容
		responseXML:返回XML形式的内容*/
	xhr.onreadystatechange=function(){
		if(xhr.readyState==4){
			if(xhr.status==200){
				alert(xhr.responseText);
			}else{
				alert(‘出错了,Err‘+xhr.status);
			}

		}
	}
}

  

 

原文地址:https://www.cnblogs.com/yangxue72/p/8241260.html

时间: 2024-11-10 13:52:24

js ajax请求流程的相关文章

js ajax请求传token

js  ajax请求传token 方法一: headers: { Authorization: "BasicAuth " + token } 方法二: beforeSend: function (xhr) { xhr.setRequestHeader('Authorization', 'BasicAuth ' +token); } 原文地址:https://www.cnblogs.com/zlp520/p/9645951.html

当跨域时,js ajax 请求出现options请求

上面有文章说过http的options. 查了很久.试了很多版本的jQuery,下面这段代码在同事的机子上测试是没有问题的.正常 的请求, 一在我机子上面就会出现option,网上说先向服务器预检等.为什么在同事的机子上面是正常的呢..最后查出原因.是我在html页面还引入了一个全局的js文件,里面有一个全局配置crossDomain:false,于是我在ajax请求是加上crossDomain:true,就OK了..让其请求是跨域请求. postdata:function(t,i){ var

使用js+Ajax请求API接口数据-带请求头方式

先上代码: <script type="text/javascript"> function zLoginCheck() { var Account = 'admin; var Password = 'DC483E80A7A0BD9EF71D8CF973673924'; var str = { Account: Account, Password: Password } $.ajax({ type: "POST", url: '/Handle/zLogi

JS ajax请求 formData传参方式

1 $("#importBtn").click(function(){ 2 if($("#conId").val() == ""){ 3 alert("请填写Id"); 4 return; 5 } 6 if($("#fromWhere").val() == ""){ 7 alert("请填写简称"); 8 return; 9 } 10 if($("#impo

解决nockout.js Ajax请求返回的结果,Model不能更新

由于Ajax返回之后需要重新问nockout相关属性赋值,首先属性应该被定义为observable属性,在Ajax返回值之后需要重新bind,代码如下: <script type="text/javascript"> function ViewModel() { var self = this; self.email = ko.observable(); self.password = ko.observable(); self.username = ko.observab

原生JS Ajax 请求

var username = document.getElementById('username').value; var password = document.getElementById('password').value; // 第一步:创建对象 var xhr = null; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ xhr = new ActiveXObject("Microsoft.XMLHTTP&q

js ajax请求

var XMLHttpReq; function createXMLHttpRequest() { try { XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP");//IE高版本创建XMLHTTP } catch(E) { try { XMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP");//IE低版本创建XMLHTTP } catch(E) { XMLHttpReq =

JS/Jquery:jquery封装ajax请求。

jquery提供了ajax请求,但这个写起来很繁琐,所以我在项目里对其进行了简单封装,为了用起来方便嘛~~~~~ 以后每次都引入这个js文件就可以了: 下面是代码部分: base.js //ajax请求 var ajaxRequest = function () { }; ajaxRequest.prototype = { //初始化设置 url : '', dataType : 'json', data:'', //初始化ajax参数 setUp : function(){ $.ajaxSet

js实现AJAX请求

摘自:http://www.myexception.cn/javascript/1448345.html AJAX:全称“Asynchronous JavaScript and XML”(异步的JavaScript与XML) AJAX请求的特点: 1.不刷新页面 2.服务器仅返回需要的数据 AJAX引擎:XMLHttpRequest此对象是浏览器中的内置对象,在目前的所有浏览器中都支持此对象. IE中获取此对象: if(window.ActiveXObject){            var