JavaScript和XMLHttpRequest - 腾讯云开发者社区

文章/答案/技术大牛

发布

JavaScript异步编程2——结合XMLHttpRequest使用Promise

概述在上一篇文章《JavaScript异步编程1——Promise的初步使用》，简单介绍了一下Promise的初步使用。...Promise对象的参数也是一个function B，内部进行了一个异步操作（通常是JavaScript提供的API）。 function B对象的参数是两个回调函数resolve和reject。...调用Promise对象的then方法，参数是resolve和reject的真正响应函数。当异步操作完成了，就会执行相应分支的响应函数。.../PromiseTest.js"> 如果不使用Promise，那么相应的JavaScript代码为： $(function () { var...参考 Ajax原理-原生js的XMLHttpRequest对象意义 Javascript异步编程的4种方法

1.3K1 0

XMLHttpRequest

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...方法还未被调用 1 OPENED (未发送) open() 方法已被成功调用，send() 方法还未被调用 2 HEADERS_RECEIVED (已获取响应头) send() 方法已经被调用，响应头和响应状态已经返回

8010 0

您找到你想要的搜索结果了吗？

是的

没有找到

XMLHttpRequest

它甚至支持 HTTP 以外的协议(包括 file:// 和 FTP)，但可能受到出于安全等原因的限制。 ?...和 status 属性一样，当 readyState 小于 3 的时候读取这一属性会导致一个异常。...getResponseHeader() 返回指定的 HTTP 响应头部的值 open() 初始化 HTTP 请求参数，例如 URL 和 HTTP 方法，但是并不发送请求 send() 发送 HTTP...大多数浏览器实施了一个同源安全策略，并且要求这个 URL 与包含脚本的文本具有相同的主机名和端口。 ③ async 参数指示请求使用应该异步地执行。...④ username 和 password 参数是可选的，为 url 所需的授权提供认证资格。如果指定了，它们会覆盖 url 自己指定的任何资格。

1.8K4 0

XMLHttpRequest对象的属性和方法

XMLHttpRequest对象的属性: （1）readyState属性该属性代表请求的状态,当XMLHttpRequest对象把一个HTTp请求发送到服务器端时,会经历若干状态,一直等待直到请求被处理...,然后再接收一个响应,这样脚本才能正确地响应各种状态,XMLHttpRequest对象的readyState属性值如下表所示: 属性说明 onreadystatechange 状态改变时都会触发这个事件处理器...,指向一个JavaScript函数 status 服务器的HTTP状态码 statusText HTTP状态码的相应文本 responseText 服务器的响应,通常为一个字符串 responseXML...服务器的响应,通常为一个XML,可以解析为一个DOM对象 readyState 请求状态 readyState属性值说明 0 未初始化状态,此时已创建了一个XMLHttpRequest对象,但是还没有初始化...对象会将它的readyState属性设置为1,并且把responseText､responseXML､status和statusText属性设置为他们的初始值｡（３）send()方法在调用open(

2.1K1 0

AngularJS XMLHttpRequest

废弃声明 (v1.5) v1.5 中$http 的 success 和 error 方法已废弃。使用 then 方法替代。...函数 customersController 是一个标准的 JavaScript 对象构造器。控制器对象有一个属性: $scope.names。

3.2K3 0

XMLHttpRequest对象的属性和事件分析

对象 AJAX利用一个构建到所有现代浏览器内部的对象-XMLHttpRequest-来实现发送和接收HTTP请求与响应信息。...创建 XMLHttpRequest 对象 xmlhttp=new XMLHttpRequest(); 一个经由XMLHttpRequest对象发送的HTTP请求并不要求页面中拥有或回寄一个＜form＞元素...AJAX中的"A"代表了"异步"，这意味着XMLHttpRequest对象的send()方法可以立即返回，从而让Web页面上的其它HTML/JavaScript继续其浏览器端处理而由服务器处理HTTP请求并发送响应...XMLHttpRequest对象的属性和事件　当XMLHttpRequest对象把一个HTTP请求发送到服务器时将经历若干种状态：一直等待直到请求被处理；然后，它才接收一个响应。　...1 描述一种"发送"状态；此时，代码已经调用了XMLHttpRequest open()方法并且XMLHttpRequest已经准备好把一个请求发送到服务器。

1.1K0 0

AJAX的XMLHttpRequest

readyState属性标识当前的XMLHttpRequest对象处于什么状态 0表示为未初始化，1表示准备发送状态，2表示已发送状态，3正在接收，4完成响应 responseText属性包含客户端接收到的...statusText属性同上面一样只有在3、4才能用，描述了http状态代码文本 onreadystatechange事件每次readyState的值变化都会触发这个事件，一般用于回调函数 open()方法用于XMLHttpRequest...来初始化对象 send()方法发送数据 abort()方法可以暂停httprequest请求或者发送httpresponse的接收，并可以把XMLHttpRequest对象改变成初始化状态 setRequestHeader

9114 0

XMLHttpRequest之onreadystatechange

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

6323 0

XMLHttpRequest用法介绍

正因为这些原因后来才出现了ajax，它是一种交互式的网页开发技术，而XMLHttpRequest是它的核心的内容，它能够为页面中的javascript脚本提供特定的通信方式，从而使页面的javascript...脚本和服务器之间形成动态交互的效果，XMLHTTPRequest的最大的优点是页面内的javascript脚本可以不用刷新页面，而直接和服务器发生交互，从而实现页面无刷新的效果。...1.下面首先来介绍一下XMLHttpRequest的详细属性和方法：方法和属性描述 Open（String method,String url,Boolean ansynch,String username...Onreadystatechage 请求状态改变的时间触发器（readyState变化时会调用这个属性上注册的javascript函数） 2.然后介绍一下XMLHttpRequest的使用步骤：...这需要调用XMLHttpRequest对象的open()和send()方法。

2.3K5 0

五步学会XMLHttpRequest

一、XMLHttpRequest的由来 XMLHttpRequest是AJAX的核心技术，通过调用XMLHttpRequest对象的属性和方法可以实现在客户端和浏览器之间进行数据的异步传输...2) IE7以后的版本和FireFox，Opera等浏览器则可以直接创建js的XMLHttpRequest对象。...对象的属性和方法 XMLHttpRequest对象的常用属性： onreadystatechange：指定当readyState属性值改变时的事件处理句柄；...并注意GET方式和POST方式在设置send方式的参数不同。 4、回调函数中，最好判断readyState和status的两个if条件，分开来写。...下面是本示例的完整代码： javascript"> var xmlhttp; function submit(){

1.4K1 0

【通信】XMLHttpRequest 代码说明

概述 XMLHttpRequest是一个前端获取服务端数据的API对象。...代码示例 var request = new XMLHttpRequest(); request.onload = function() { if(this.status == 200...} else { // handle error } } request.open("GET", "xxxUrl"); request.send(); 代码说明示例中实例化了一个XMLHttpRequest...XMLHttpRequest支持的事件主要有： onloadstart onprogress onabort onerror onload ontimeout onloadend onreadystatechange

8841 0

XMLHttpRequest对象详解（一）

本文介绍关于XMLHttpRequest对象的基础知识（基于规范化的属性和方法），更深入的探讨在之后的文章中作为二级文章（“XMLHttpRequest对象详解二”，“XMLHttpRequest对象详解之使用...提示：在看本文时，可以参考昨天的 ajax 源码深入理解，文章可从历史记录中查找 XMLHttpRequest 对象还没有标准化，它有一些规范化（浏览器都已包括）和非规范化（部分浏览器实现）的属性和方法...得到了所有现代浏览器较好的支持，在IE5和IE6中必须使用特定于IE的ActiveXObject()构造函数。附图谷歌浏览器和火狐浏览器的对象属性。...XMLHttpRequest对象提供了对HTTP协议的完全访问，包括做出POST和HEAD请求以及普通的get请求的能力。...4. response 返回响应体，可以是ArrayBuffer, Blob, Document, JavaScript Object or a DOMString.

8301 0

XMLHttpRequest对象常用资料总结

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属性） 200：服务器响应正常

7544 0

WEB性能(7)--XMLHttpRequest

本文链接：https://blog.csdn.net/caomage/article/details/101906193 一、XMLHttpRequest XMLHttpRequest（XHR）是浏览器层面的...API，可以让开发人员通过JavaScript实现数据传输。...因此，要监控进度，可以子啊XHR对象上注册一系列JavaScript事件监听器。...七、XHR使用场景及性能 XMLHttpRequest是我们从在浏览器中做网页转向开发web应用的关键。首先，它让我们在浏览器中实现了异步通信，但同样重要的是，它还把这个过程变得非常简单。...分派和控制HTTP请求只要几行JavaScript代码，而其他负责的工作都交给浏览器了：浏览器格式化HTTP请求并解析响应；浏览器强制施加相关的安全（同源）策略；浏览器处理内容协商（如gzip

1.1K1 0

XMLHttpRequest的基本使用

XMLHttpRequest（简称xhr）是浏览器提供的JavaScript对象，通过它，可以请求服务器上的数据资源，jQuery中的Ajax函数就是基于xhr对象封装出来的。...使用xhr发起GET请求 //1.创建XHR对象 var xhr = new XMLHttpRequest() //2.调用open函数，指定请求方式与URL地址 xhr.open('GET','URL...= 200){ //4.2 打印服务器响应回来的数据 console.log(xhr.responseText) } } xhr对象的readyState属性 XMLHttpRequest...对象的readyState属性，用来表示当前Ajax请求所处的状态，每个Ajax请求必然处于以下状态中的一个：值状态描述 0 UNSENT XMLHttpRequest对象已被创建，但尚未调用open...使用xhr发起POST请求 //1.创建XHR对象 var xhr = new XMLHttpRequest() //2.调用open函数 xhr.open('POST','URL地址') //3.设置

7181 0

XMLHttpRequest对象的方法分享

XMLHttpRequest对象的方法 abort()方法　你可以使用这个abort()方法来暂停与一个XMLHttpRequest对象相联系的HTTP请求，从而把该对象复位到未初始化状态。...对于要求认证的服务器，你可以提供可选的用户名和口令参数。...在调用open()方法后，XMLHttpRequest对象把它的readyState属性设置为1(打开)并且把responseText、responseXML、status和statusText属性复位到它们的初始值...getAllResponseHeaders()方法发送请求　在AJAX中，许多使用XMLHttpRequest的请求都是从一个HTML事件（例如一个调用JavaScript函数的按钮点击(onclick...如果不是使用AJAX技术来校验这个UserID域，那么整个表单都必须被填充和提交。如果该UserID不是有效的，这个表单必须被重新提交。

1K2 0

ajax实现步骤之XMLHttpRequest

我们现在开发一直在使用ajax或者是axios与后台进行交互，这两个在浏览器工作的时候都是基于XMLHttpRequest，只不过是封装了便于使用。...axios 是一个基于 Promise 的http请求库，可以用在浏览器和node.js中，很多不知道的是，高版本的jQuery中，ajax也是一个Promise对象。...今天我们主要了解一下XMLHttpRequest的过程。建立对象：首先建立一个XMLHttpRequest对象，就是new一个对象出来。...一般成功状态是200，很多封装的时候判断是大于等于200和小于300就是成功，还有一个特殊304也是成功的标志。...概括来说，ajax和axios请求过程分成5步，创建对象、设置回调函数、建立连接、发送请求、回调函数进行操作。

7312 0

Ajax 之战：XMLHttpRequest 与 Fetch API

多年来已经引入了几种选择，目前有两种主要方法，大多数 JavaScript 框架使用其中一种或两种。...在本文中，我们将研究早期 XMLHttpRequest 和现代 Fetch 的优缺点，以确定哪种 Ajax API 最适合你的应用。...AJAX 是“Asynchronous JavaScript and XML”的缩写，尽管严格地说，开发人员并不需要使用异步方法、JavaScript 或 XML。...重定向控制默认情况下，fetch() 和 XMLHttpRequest 都遵循服务器重定向。...Node 18 中完全支持 Fetch，在服务器和客户端使用相同的 API 有助于减少认知成本，还提供了在任何地方运行的同构 JavaScript 库的可能性。

3.1K2 0

剖析XMLHttpRequest对象理解Ajax机制

XMLHttpRequest对象是当今所有AJAX和Web 2.0应用程序的技术基础。...而且，AJAX可以用于任何客户端脚本语言中，这包括JavaScript，Jscript和VBScript。　　...本文将对XMLHttpRequest对象API进行详细讨论，并将解释其所有的属性和方法。...二、 XMLHttpRequest对象的属性和事件　　XMLHttpRequest对象暴露各种属性、方法和事件以便于脚本处理和控制HTTP请求与响应。下面，我们将对此展开详细的讨论。...onkeyup事件调用一个JavaScript sendRequest()函数。这个sendRequest()函数创建一个XMLHttpRequest对象。

1.9K2 0

XMLHttpRequest使用指南大全

Ajax和XMLHttpRequest 我们通常将Ajax等同于XMLHttpRequest，但细究起来它们两个是属于不同维度的2个概念。...它依赖的是现有的CSS/HTML/Javascript，而其中最核心的依赖是浏览器提供的XMLHttpRequest对象，是这个对象使得浏览器可以发出HTTP请求与接收HTTP响应。...XMLHttpRequest标准又分为Level 1和Level 2。...XMLHttpRequest Level 1主要存在以下缺点：受同源策略的限制，不能发送跨域请求；不能发送二进制文件（如图片、视频、音频等），只能发送纯文本数据；在发送和获取数据的过程中，无法实时获取进度信息...，只能判断是否完成；那么Level 2对Level 1 进行了改进，XMLHttpRequest Level 2中新增了以下功能：可以发送跨域请求，在服务端允许的情况下；支持发送和接收二进制数据；

1.7K3 0

点击加载更多

JavaScript异步编程2——结合XMLHttpRequest使用Promise

XMLHttpRequest

XMLHttpRequest

XMLHttpRequest对象的属性和方法

AngularJS XMLHttpRequest

XMLHttpRequest对象的属性和事件分析

AJAX的XMLHttpRequest

XMLHttpRequest之onreadystatechange

XMLHttpRequest用法介绍

五步学会XMLHttpRequest

【通信】XMLHttpRequest 代码说明

XMLHttpRequest对象详解（一）

XMLHttpRequest对象常用资料总结

WEB性能(7)--XMLHttpRequest

XMLHttpRequest的基本使用

XMLHttpRequest对象的方法分享

ajax实现步骤之XMLHttpRequest

Ajax 之战：XMLHttpRequest 与 Fetch API

剖析XMLHttpRequest对象理解Ajax机制

XMLHttpRequest使用指南大全

相关资讯

热门标签

活动推荐

运营活动

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐