Ajax基础教程--- 2.1 XMLHttpRequest对象概述

Vue——Ajax【初识XMLHttpRequest对象】 一、Ajax 是什么?Ajax请求也是HTTP请求,是一种特殊的HTTP请求。由游览器或者Ajax发起的请求对于服务器来说是没有区别的,这个区别要体现在客户端游览器本身的主要功能是发起请求和接收响应并直接解析响应内容显示到页面,并伴随着网页的刷新的,界面就会改变Ajax通过Ajax引擎发起请求,对于Ajax的响应数据只会被传递到监听函数中,监听函数会自动调用,对于取回来的数据,不会对界面进行任何操作的,需要手动操作DOM,可以称为局部界面更新。 阅读详情

在使用XMLHttpRequest对象发送请求和处理响应之前,必须先用JavaScript创建一个XMLHttpRequest对象。由于XMLHttpRequest不是一个W3C标准,所以可以采用多种方法使用JavaScript来创建XMLHttpRequest的实例。

Internet Explorer把XMLHttpRequest实现为一个ActiveX对象,

其他浏览器(如Firefox、Safari和Opera)把它实现为一个本地JavaScript对象。

由于存在这些差别,JavaScript代码中必须包含有关的逻辑,从而使用ActiveX技术或者使用本地JavaScript对象技术来创建XMLHttpRequest的一个实例。

很多人可能还记得从前的那段日子,那时不同浏览器上的JavaScript和DOM实现简直千差万别,听了上面这段话之后,这些人可能又会不寒而栗。幸运的是,在这里为了明确该如何创建XMLHttpRequest对象的实例,并不需要那么详细地编写代码来区别浏览器类型。你要做的只是检查浏览器是否提供对ActiveX对象的支持。如果浏览器支持ActiveX对象,就可以使用ActiveX来创建XMLHttpRequest对象。否则,就要使用本地JavaScript对象技术来创建。代码清单2-1展示了编写跨浏览器的JavaScript代码来创建XMLHttpRequest对象实例是多么简单。

代码清单2-1 创建XMLHttpRequest对象的一个实例

var xmlHttp;

 

function createXMLHttpRequest() {

    if (window.ActiveXObject) {

        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

    }

    else if (window.XMLHttpRequest) {

        xmlHttp = new XMLHttpRequest();

    }

}

可以看到,创建XMLHttpRequest对象相当容易。首先,要创建一个全局作用域变量xmlHttp来保存这个对象的引用。createXMLHttpRequest方法完成创建XMLHttpRequest实例的具体工作。这个方法中只有简单的分支逻辑(选择逻辑)来确定如何创建对象。对window.ActiveXObject的调用会返回一个对象,也可能返回null,if语句会把调用返回的结果看作是true或false(如果返回对象则为true,返回null则为false),以此指示浏览器是否支持ActiveX控件,相应地得知浏览器是不是Internet Explorer。如果确实是,则通过实例化ActiveXObject的一个新实例来创建XMLHttpRequest对象,并传入一个串指示要创建何种类型的ActiveX对象。在这个例子中,为构造函数提供的字符串是Microsoft.XMLHTTP,这说明你想创建XMLHttpRequest的一个实例。

如果window.ActiveXObject调用失败(返回null),JavaScript就会转到else语句分支,确定浏览器是否把XMLHttpRequest实现为一个本地JavaScript对象。如果存在window.
XMLHttpRequest
,就会创建XMLHttpRequest的一个实例。

由于JavaScript具有动态类型特性,而且XMLHttpRequest在不同浏览器上的实现是兼容的,所以可以用同样的方式访问XMLHttpRequest实例的属性和方法,而不论这个实例创建的方法是什么。这就大大简化了开发过程,而且在JavaScript中也不必编写特定于浏览器的逻辑。

 
前端必知必会-AJAX - XMLHttpRequest 对象 回调函数是作为参数传递给另一个函数的函数。在这种情况下,回调函数应包含响应准备就绪时要执行的代码。// 响应准备好后要做什么本文介绍了XMLHttpRequest 对象的使用,如有问题欢迎私信和评论。 阅读详情

相关推荐

AI驱动全栈开发实战:基于Spec与Codex的规格驱动开发指南

1. 先搞清楚“AI重构前端全栈”到底在解决什么实际问题 最近很多人在聊“AI重构前端全栈”,听起来像是又一个营销概念。但如果你真的拆开看,它核心解决的是一个非常具体且痛苦的问题: 一个开发者,如何从零开始,系统性地、不跑偏地完成一个完整项目,并且保证代码质量和架构一致性。 传统开发流程里,产品经理出PRD,前后端开会对齐,前端画页面,后端写接口,测试再介入。这个过程沟通成本高,文档容易过时,新人上手慢。而“AI重构”的思路,是试图用一套 规范化的指令(Spec) 来驱动AI(比如Codex这类模型)生成代

weixin_30596023的博客 460

JS原生:XMLHttpRequest发送GET&POST请求

学到了xhr发起GET和POST请求,在此记录一下。

欢迎来到长风沛雨的博客 1万+

win11禁止更新,草履虫教程

本文介绍了彻底禁止Windows 11系统更新的组合方法,包括禁用核心服务、修改注册表、关闭计划任务和使用组策略(专业版适用)。作者特别提醒,禁止更新会影响系统安全性,建议实体机保持更新,仅虚拟机等特殊情况下使用这些方法。同时强调即使禁用更新,也应定期手动检查重要安全补丁。文章最后附上了作者的个人网站信息。

testwzc1的博客 561

javascript XMLHttpRequest 使用教程

javascript XMLHttpRequest 基础使用教程

m0_71765265的博客 1135

cartographer从入门到精通(一):cartographer介绍

Cartographer的架构图我们可以看到白色框出来的三个区域,分别是Input Sensor Data(数据输入模块)Local SLAM(局部SLAM模块)Global SLAM (background thread)(全局SLAM模块)下面我们分别介绍一下这几个模块。

weixin_68094467的博客 1053

华为流程L1-L6业务流程深度细化到可执行【附全文阅读】

该文档主要介绍了华为业务流程的深度细化及相关内容,包括流程框架、建模方法、流程模块描述、流程图建模等,旨在帮助企业构建有效的流程体系,实现战略目标。

cdfunlove的博客 4003

JavaScript使用XMLHttpRequest 發送GET/Post 請求

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 ...

weixin_33842328的博客 191

python爬虫项目(六十八):爬取电商平台用户购买历史数据,分析消费行为

本文详细介绍了如何爬取电商平台用户购买历史数据,并分析其消费行为。通过爬虫技术、数据存储、分析和可视化等步骤,可以深入了解消费者的行为特征。未来,随着数据分析技术的不断发展,利用人工智能和机器学习方法对消费行为进行更深层次的分析,将成为电商平台提升竞争力的重要手段。

斌擎科技 2768

原生js XMLHttpRequest发送 get post 请求 解决跨域 及 注意事项

原生js XMLHttpRequest发送 get post 请求 解决跨域 及 注意事项

qq_45287575的博客 9340

Jetson Thor平台JP7.0版本96712 GMSL相机驱动调试记录

摘要:本文档记录了在Thor Custom Board (JP7.0GA)上配置GMSL摄像头时遇到的视频流问题及调试过程。问题表现为视频设备(/dev/video11)能正常创建,但获取视频时出现"Internal data stream error",而相同配置在AGX Orin JP6.0上运行正常。通过梳理硬件拓扑、v4l2-ctl测试、提升时钟频率及分析内核日志,发现VI引擎未接收到帧数据包。调试步骤包括检查设备树冲突、调整I2C总线配置、修正通道名称,最终通过屏蔽传感器启动时

jzwjzw19900922的博客 1110

32、高光谱遥感技术在军事领域的应用解析

高光谱遥感技术凭借其高分辨率和精细光谱分析能力,在军事领域广泛应用于战场详细侦察、伪装目标识别及目标实际温度与发射率的检测,显著提升了目标识别精度和作战支持能力。同时,该技术在内陆水体成分反演、海洋环境监测和农业管理等领域也展现出巨大潜力。尽管面临数据量大、处理复杂、技术融合不足和仪器性能限制等挑战,未来通过人工智能融合、高效算法研发和先进仪器开发,高光谱遥感技术将在多领域实现更深入应用与发展。

blue的专栏 230

原生JS如何发送POST请求?XMLHttpRequest来帮忙

平常用 jQuery 的 Ajax 请求习惯了,忘记了原生 JS 发送请求的方式,复习一下 var url = "http://localhost:8080/login"; var httpRequest = new XMLHttpRequest(); httpRequest.open('POST', url, true); httpRequest.setRequestHeader("Content-type", "application/json"); var obj = { "usernam.

mkii_hong的博客 1万+

QCC51XX---人机接口设备协议( HID)

QCC51XX---人机接口设备协议( HID)

weixin_42162924的博客 819

Ajax核心对象——XMLHttpRequest对象

XMLHttpRequest对象在Ajax中占据着十分重要的地位,因为通常意义上的和服务器进行交互是通过提交表单的形式,而在Ajax中的客户端通过XMLHttpRequest对象实现与服务器的通信。也就是说正是因为XMLHttpRequest才使得Ajax得以实现,于是我们的与服务器的交互速度明显提升,消除了令人头疼的等待之后用户体验便也更加良好。名字由来:XMLHttpRequest之所以叫这个

郗晓勇|利己者生,利人者恒 9616

最新的sdio 4.0 spec 协议标准 带书签 高清完整PDF版

Part-E1-SDIO-Specification-Ver4.00-Final-120220.pdf:最新的sdio 4.0 spec 协议标准 带书签 高清完整PDF版,包括SDIO 接口的外设,SDIO 接口官方协议等。

SAP B1中文培訓教材_SDK

公司内部培训资料,对开发工具 ,DIAPI, UIAPI,Add-ON有详细解说

Ajax-概述、XMLHttpRequest对象、AJAX GET请求、AJAX POST请求

本文深度解析传统请求痛点(页面刷新/体验割裂),详解AJAX核心XMLHttpRequest对象四步使用法(创建→回调→开启→发送),手写GET/POST请求解决缓存与数据提交难题,并附表单模拟实战代码。助你彻底掌握异步交互,实现页面无刷新更新!

m0_73941339的博客 1182

汉书HE8,好用的汇编代码编写工具

汉书HE8,好用的汇编代码编写工具早期编写汇编代码所用功能强大

AJAX的XMLHttpRequest对象

XMLHttpRequest(XHR)是 AJAX(异步 JavaScript 和 XML)的核心对象,用于在不重新加载整个页面的情况下,与服务器进行异步数据交互。它允许浏览器在后台向服务器发送请求、接收响应,并更新页面部分内容。2.XMLHttpRequest 的基本使用步骤。

2501_92527267的博客 1739

Devexpress16.2.6破解工具

Devexpress16.2.6破解工具Devexpress16.2.6破解工具Devexpress16.2.6破解工具Devexpress16.2.6破解工具

XMLHttpRequest和Ajax

XMLHttpRequest和Ajax的关系 ajax是一种技术方案,但并不是一种新技术。 ajax最核心的依赖是浏览器提供的XMLHttpRequest对象。 所以我用一句话来总结两者的关系:我们使用XMLHttpRequest对象来发送一个Ajax请求 XMLHttpRequest的发展历程 XMLHttpRequest一开始只是微软浏览器提供的一个接口,后来各大浏览器纷纷效仿也提供了这个接口...

借物小人的博客 6371

AJAX中的XMLHttpRequest对象

王兴奎老师的视频已经看完了,这部分的总结工作还没有开始,开始遇到新的知识点或是不大明白的知识都没有及时的进行总结,只是将自己想总结的内容都列在了Onenote中,现在回过头来一点点的进行总结,这篇博客是对XMLHttpRequest对象的总结,在总结XMLHttpRequest对象之前我们还是先来回顾一下什么是AJAX以及wome。 一.什么是AJAX 说到这自己还有些羞愧,那天学敏问我AJA

陈金荣 2260

AJAX - 创建 XMLHttpRequest 对象

XMLHttpRequest 是 AJAX 的基础。

m0_65696193的博客 936

Ajax概述及XMLHttpRequest对象的常见属性方法

目录Ajax概述Ajax优点Ajax缺点Ajax核心XMLHttpRequest对象的方法XMLHttpRequest对象的属性HTTP概述请求报文响应报文 Ajax概述 Ajax:Asynchronous JavaScript And XML,异步JavaScript和XML技术。 不是一门新的语言或技术,是由JavaScript、XML、DOM、CSS等多种已有技术组合而成的一种浏览器端技术。 它是浏览器提供的一套方法,可以实现页面无刷新更新数据,提高用户浏览网站应用的体验。 通过AJAX可以在浏览器向

m0_52942098的博客 1070

Ajax中XMLHttpRequest对象的详细解析

const xhr=new XMLHttpRequest();xhr.open(‘get’,‘/server’,true);xhr.onreadystatechange=function(){if(xhr.readyState!==4){return}if(xhr.status>=200&&xhr.status

2401_89284204的博客 1508

Ajax的核心——XMLHttpRequest 对象

XMLHttpRequest对象简介  XMLHttpRequest对象是AJax的核心,XMLHttpRequest 是XMLHTTP 组件的对象,通过这个对象,AJAX 可以像桌面应用程序一样只同服务器进行数据层面的交换,而不用每次都刷新界面,也不用每次将数据处理的工作都交给服务器来做;这样既减轻了服务器负担又加快了响应速度、缩短了用户等待的时间。  IE5.0 开始,开发人员可以在Web 页

jxufewbt的专栏 1167
上一篇: Ajax基础教程---- 1.7 设计考虑
下一篇: Ajax基础教程--- 2.2 方法和属性
wei198621
博客等级 码龄20年 169粉丝 388原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值