本文介绍关于XMLHttpRequest对象的基础知识(基于规范化的属性和方法),更深入的探讨在之后的文章中作为二级文章(“XMLHttpRequest对象详解二”,“XMLHttpRequest对象详解之使用...提示:在看本文时,可以参考昨天的 ajax 源码深入理解,文章可从历史记录中查找 XMLHttpRequest 对象还没有标准化,它有一些规范化(浏览器都已包括)和非规范化(部分浏览器实现)的属性和方法...XMLHttpRequest对象用于在后台与服务器交互数据。...XMLHttpRequest对象提供了对HTTP协议的完全访问,包括做出POST和HEAD请求以及普通的get请求的能力。...当readyState为0时(当XMLHttpRequest对象刚创建或者abort()方法调用后)以及当readyState为4时(已经接收响应时),调用这个方法是安全的,当针对任何其他状态调用的时候
1、XMLHttpRequest的方法 -abort 停止发送当前请求 -getAllResponseHeaders() 获取服务器返回的全部相应头(字符串形式) -getResponseHeader(...-send(content) 发送请求,其中content是请求参数 -setRequestHeader("label", "value") 发送请求前,设置请求头 2、XMLHttpRequest的属性...-onreadystatechange 指定XMLHttpRequest对象状态改变时的事件处理函数 -readyState XMLHttpRequest对象的处理状态 -responseText 获取服务器的相应文本...responseXML 获取服务器响应的XML文档对象 status 服务器返回的状态码 statusText 服务器返回的状态文本信息,只有当服务器响应已经完成时才会有该状态文本信息 3.readyState...的值(XMLHttpRequest对象状态) 0:XMLHttpRequest对象还未初始化 1:开始发送请求 2:请求发送完成 3:开始读取服务器的响应 4:读取服务器响应结束 4.服务器状态码(status
XMLHttpRequest对象的方法 abort()方法 你可以使用这个abort()方法来暂停与一个XMLHttpRequest对象相联系的HTTP请求,从而把该对象复位到未初始化状态。...另外,uri参数用于指定XMLHttpRequest对象把请求发送到的服务器相应的URI。...注意,如果你调用open()方法并且此时readyState为4,则XMLHttpRequest对象将复位这些值。...仅当readyState值为1时,你才可以调用send()方法;否则的话,XMLHttpRequest对象将引发一个异常。该请求被使用提供给open()方法的参数发送到服务器。...在调用send()方法后,XMLHttpRequest对象把readyState的值设置为2(发送)。
XMLHttpRequest对象是当今所有AJAX和Web 2.0应用程序的技术基础。...其他的认识到这一对象重要性的浏览器制造商也都纷纷在他们的浏览器内实现了XMLHttpRequest对象,但是作为一个本地JavaScript对象而不是作为一个ActiveX对象实现。...二、 XMLHttpRequest对象的属性和事件 XMLHttpRequest对象暴露各种属性、方法和事件以便于脚本处理和控制HTTP请求与响应。下面,我们将对此展开详细的讨论。...三、 XMLHttpRequest对象的方法 XMLHttpRequest对象提供了各种方法用于初始化和处理HTTP请求,下列将逐个展开详细讨论。 ...这个sendRequest()函数创建一个XMLHttpRequest对象。创建一个XMLHttpRequest对象的过程因浏览器实现的不同而有所区别。
XMLHttpRequest对象的属性: (1)readyState属性 该属性代表请求的状态,当XMLHttpRequest对象把一个HTTp请求发送到服务器端时,会经历若干状态,一直等待直到请求被处理...,然后再接收一个响应,这样脚本才能正确地响应各种状态,XMLHttpRequest对象的readyState属性值如下表所示: 属性 说明 onreadystatechange 状态改变时都会触发这个事件处理器... password)方法 该方法用来初始化一个XMLHttpRequest对象,其中,method参数用于指定发送请求的HTTP方法(可以使GET方法、POST方法、PUT方法、DELETE方法或HEAD...方法)。如果想将数据发送到服务器,则应该使用POST方法。如果想从服务器端检索数据,则应该使用GET方法。方法中的uri参数用于指定XMLHttpRequest对象把请求发送到与服务器相应的URI。Async...参数指定了请求是否是异步的,其默认值是true。如果想发送一个同步请求,则需要把这个值设置为false。在调用open()方法后,XMLHttpRequest对象会将它的readyState属性设置为1
XMLHttpRequest 是AJAX中最重要的对象。它可以向服务器发送请求并接收响应。...下面是一个创建 XMLHttpRequest 对象的示例:var xhttp = new XMLHttpRequest();上面的代码创建了一个名为‘xhttp’的新 XMLHttpRequest 对象...现在,您可以使用该对象来发送请求和接收响应。创建 AJAX 请求要向服务器发送AJAX请求,您需要设置 XMLHttpRequest 对象的属性和方法。...结论使用XMLHttpRequest对象和AJAX,您可以创建快速的动态Web应用程序。...通过理解AJAX和XMLHttpRequest对象,您可以创建高效和强大的Web应用程序。
对象 AJAX利用一个构建到所有现代浏览器内部的对象-XMLHttpRequest-来实现发送和接收HTTP请求与响应信息。...XMLHttpRequest 对象用于在后台与服务器交换数据。...创建 XMLHttpRequest 对象 xmlhttp=new XMLHttpRequest(); 一个经由XMLHttpRequest对象发送的HTTP请求并不要求页面中拥有或回寄一个<form>元素...XMLHttpRequest对象的属性和事件 当XMLHttpRequest对象把一个HTTP请求发送到服务器时将经历若干种状态:一直等待直到请求被处理;然后,它才接收一个响应。 ...表格1.XMLHttpRequest对象的ReadyState属性值列表。
在做异步操作的时候,我们通常需要判断返回的状态码来判断服务器返回的数据是否正常,下面是常见的一些状态码和对应的含义。
1. get请求 const xhr = new XMLHttpRequest() xhr.open('GET', '/api', false) xhr.onreadystatechange = ()...== 200) { console.log(xhr.responseText) } } } xhr.send(null) 2. post请求 const xhr = new XMLHttpRequest...readyState: unsigned short - 用于表示请求的五种状态: 值 状态 描述 0 UNSENT (未打开) 表示已创建 XHR 对象,open() 方法还未被调用 1 OPENED
什么是 XMLHttpRequest 对象? XMLHttpRequest 对象用于在后台与服务器交换数据。...XMLHttpRequest 对象是开发者的梦想,因为您能够: 在不重新加载页面的情况下更新网页 在页面已加载后从服务器请求数据 在页面已加载后从服务器接收数据 在后台向服务器发送数据 所有现代的浏览器都支持...XMLHttpRequest 对象。...1、如何创建兼容良好的XMLHttpRequest 对象: function createXmlRequest(){ var xmlHttp; try{ xmlHttp=new...xmlHttp && typeof XMLHttpRequest!
1.1 什么是 XMLHttpRequest XMLHttpRequest(XHR) 对象用于与服务器交互。通过 XMLHttpRequest 可以在不刷新页面的情况下请求特定 URL,获取数据。...XMLHttpRequest 对象已创建或已被 abort() 方法重置 1 Open open() 方法已调用,但是 send() 方法未调用。...的使用 ☞ 创建 XMLHttpRequest 对象 var xhr = new XMLHttpRequest(); ☞ 初始化 HTTP 请求参数 xhr.open(method, url, async...当 readyState 为 0 的时候(当 XMLHttpRequest 对象刚创建或者 abort() 方法调用后)以及当 readyState 为 4 时(已经接收响应时),调用这个方法是安全的。...除了保存供 send() 方法使用的请求参数,以及重置 XMLHttpRequest 对象以便复用,open() 方法没有其他的行为。
只写 readyState 返回当前请求的状态,只读. responseBody 将回应信息正文以unsigned byte数组形式返回.只读 responseStream 以Ado Stream对象的形式返回响应信息...只读 responseText 将响应信息作为字符串返回.只读 responseXML 将响应信息格式化为Xml Document对象并返回,只读 status 返回当前请求的http状态码.只读 statusText...返回当前请求的响应行状态,只读 readyState 变量,此属性只读,状态用长度为4的整型表示.定义如下: 0 (未初始化) 对象已建立,但是尚未初始化(尚未调用open方法) 1 (初始化) 对象已建立
ng-controller 指令设置了 controller 对象 名。 函数 customersController 是一个标准的 JavaScript 对象构造器。...控制器对象有一个属性: $scope.names。 $http.get() 从web服务器上读取静态 JSON 数据。
readyState属性 标识当前的XMLHttpRequest对象处于什么状态 0表示为未初始化,1表示准备发送状态,2表示已发送状态,3正在接收,4完成响应 responseText属性 包含客户端接收到的...statusText属性 同上面一样只有在3、4才能用,描述了http状态代码文本 onreadystatechange事件 每次readyState的值变化都会触发这个事件,一般用于回调函数 open()方法 用于XMLHttpRequest...来初始化对象 send()方法 发送数据 abort()方法 可以暂停httprequest请求或者发送httpresponse的接收,并可以 把XMLHttpRequest对象改变成初始化状态 setRequestHeader
在实现 AJAX 的过程中,创建一个 XMLHttpRequest 对象是必不可少的。...XMLHttpRequest 对象简介XMLHttpRequest 是一个 JavaScript 内置的对象,它提供了在浏览器和服务器之间进行数据交换的能力。...创建 XMLHttpRequest 对象要创建一个 XMLHttpRequest 对象,可以使用如下代码:var xhr = new XMLHttpRequest();上述代码会创建一个新的 XMLHttpRequest...我们可以通过 xhr 对象来执行各种 AJAX 相关的操作。XMLHttpRequest 对象属性和方法XMLHttpRequest 对象拥有一系列属性和方法,用于配置和控制 AJAX 请求。...readyState:表示 XMLHttpRequest 对象的请求状态,其值为整数。0:未初始化。XMLHttpRequest 对象已创建但尚未调用 open() 方法。1:已打开。
XMLHttpRequest之onreadystatechange function doReq(url, fn){ var req = new XMLHttpRequest(); req.onreadystatechange... = function(){ if(this.readyState == XMLHttpRequest.DONE){ return fn(this); ...myreq); console.log(res); 本文采用 「CC BY-NC-SA 4.0」创作共享协议,转载请标注以下信息: 原文出处:Yiiven https://www.yiiven.cn/js-xmlhttprequest-onreadystatechange.html
概述 XMLHttpRequest是一个前端获取服务端数据的API对象。...代码示例 var request = new XMLHttpRequest(); request.onload = function() { if(this.status == 200...} else { // handle error } } request.open("GET", "xxxUrl"); request.send(); 代码说明 示例中实例化了一个XMLHttpRequest...对象,通过为该对象绑定onload回调函数处理从xxxUrl返回来的数据。...XMLHttpRequest支持的事件主要有: onloadstart onprogress onabort onerror onload ontimeout onloadend onreadystatechange
一、XMLHttpRequest的由来 XMLHttpRequest是AJAX的核心技术,通过调用XMLHttpRequest对象的属性和方法可以实现在客户端和浏览器之间进行数据的异步传输...二、 XMLHttpRequest对象的五步使用法 1....创建XMLHttpRequest对象 初期由于各个浏览器在实现上有所不同: 1) IE6及以前的版本,是以ActiveX控件的方式来创建XMLHttpRequest对象。...2) IE7以后的版本和FireFox,Opera等浏览器则可以直接创建js的XMLHttpRequest对象。...在使用XMLHttpRequest对象之前需要将XMLHttpRequest对象实例化,因为各个浏览器对实例化过程的实现不同,所以不同浏览器实例化XMLHttpRequest对象的方式也不相同。
一、初始化XMLHttpRequest对象 在使用XMLHttpRequest对象之前需要将XMLHttpRequest对象实例化,因为各个浏览器对这个实例化过程的实现不同,所以针对不同的浏览器实例化...XMLHttpRequest对象的方式也不尽相同。...(); 所以,综合了这两种实例化XMLHttpRequest的形式,就可以提取出一个实例化的公共方法,代码如下: Js代码 //实例化XMLHttpRequest对象 function...这需要调用XMLHttpRequest对象的open()和send()方法。...上述四个步骤,就是XMLHttpRequest对象在Ajax程序中的运行周期,即初始化、指定响应函数、发送请求、处理响应。
=document.getElementById("formId"); var formData=new FormData(form); var oReq = new XMLHttpRequest
领取专属 10元无门槛券
手把手带您无忧上云