ajax中XMLHttpRequest对象详解

2023-11-16

                                                                                              ajax中XMLHttpRequest对象详解

        ajax技术的核心或者说负责ajax进行同步或者异步服务器请求是XMLHttpRequest对象。在用使用ajax技术时,其实就是操作XMLHttpRequest进行相应的业务。
 
 方法: 
  1创建XMLHttpRequest对象
    ajax本身还是js写成的,所以在使用XMLHttpRequest,是按照js语法的。
生成一个XMLHttpRequest对象如下:var xhr=new XMLHttpRequest();
注意IE浏览器9以下的版本都不支持,IE是在9版本后才归于主流,支持w3c标准的。 
考虑到兼容性,我们可以这样写。
function createXHR()
{
   var xhr=null;
  if(window.XMLHttpRequest)  //要是支持XMLHttpRequest的则采用XMLHttpRequest生成对象
     xhr=new XMLHttpRequest();
  else if(window.ActiveXobiect)//要是支持win的ActiveXobiect则采用ActiveXobiect生成对象。
    xhr=new ActiveXobiect('Microsoft.XMLHTTP');
   return xhr;
}
  2.如何利用XMLHttpRequest对象打开请求
        xhr.open('请求方式','请求url',是异步|同步)
我们通过XMLHttpRequest对象的open函数打开对服务器的连接,设置请求方式如GET POST OPTION DELETE等,请求路径,同步请求或者是异步请求(true表示异步请求,false表示同步请求)


  3. send() 
     发送请求,不传值时可以写null,get或者post请求传值时可以键值对写 username=zhangsan&pwd=12345
POST请求时,一定要注意要设置 Content-Type: application/x-www-form-urlencoded 不然无法解析&分隔符。
 
  4. abort()
     终止请求
 
  5. setRequestHeader(key,value);
     设置请求头信息
  
  6. getResponseHeader(key)
     获取某个头信息
  
  7. getAllResponseHeaders()
     获取所有的头信息

属性:
  1. responseText
     文本返回值,可以通过对象的responseText属性,获得返回的主体内容。

  2. onreadystatechange
     监测xhr对象发送接收状态变化的事件属性。xhr对象在发送到接收会有一系列状态的变化,这些状态变化时,会触发该对象的onreadystatechange回调函数,
一般我们是通过自定义一个匿名函数,在这个函数中进行我们想要的处理,将其赋给onreadystatechange事件属性,一旦触发就可以执行我们需要的操作。
 
  3. readyState
     表示自身状态,值为0~4  其中4表示返回成功。 0表示xhr对象创建成功 1表示调用open函数成功  2对方接收完头信息
     3对方接受完主体信息  4成功断开连接
  4. status
     响应行的状态码,200表示成功,403表示禁止,404表示未找到,50X系列表示服务器内部错误。
  5.statusText
     服务器返回状态,对应的文字说明
 
  
  5.响应行的 状态文字 statusText
  
  6.responseXML
    对于大量格式化文档时,或者xml文件时,回传的值。

   注意,ajax不能跨域请求,只能是请求本域内文件或后台程序。
        

         在html5中支持,使用ajax实现文件的异步上传,这一功能的实现主要是靠新增的两个对象完成
FormData和files对象。FormData主要是用来获得表单提交的信息,例如tform是一个表单的js中的dom对象,
var fd=new FormData(tform); 则生成的FormData对象就将表单对象中提交的信息全部加载如fd对象中了,
之后只要使用XMLHttpRequest对象的send()函数放送fd即可。当然FormData可以通过自身的append()函数手动加载键值对
如 fd.append('username','zhangsan');
         files是<input type='file' name='' />标签dom对象下的一个文件列表对象,可以获得上传文件的所有信息。html5支持多文件上传。在使用异步上传文件时,我们通过fd.append('name',files[0])异步上传文件。
















  

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

ajax中XMLHttpRequest对象详解 的相关文章

  • Git——Day3(Github Pages搭建个人网站)

    1 个人站点访问 https github用户名 github io 2 搭建步骤 1 创建个人站点 gt 新建仓库 注 仓库名必须是 用户名 github io 2 在仓库下新建index html的文件即可 注意 1 github pa
  • Python报错socket.gaierror: [Errno 11001] getaddrinfo failed

    1 报错 from scapy all import sr IP ICMP target 192 168 142 129 pkt IP dst target ICMP ans unans sr pkt timeout 1 for s r i
  • GitHub Desktop客户端下载安装,以及上传到服务端

    下载安装地址 https desktop github com 使用教程 https blog csdn net qqw666666 article details 125652869 操作流程 就是不同应用端的交互 做好相关验证即可
  • 应用中间件二、Tomcat单机多实例部署

    Tomcat 常见的几种部署场景 通常 我们在同一台服务器上对 Tomcat 部署需求可以分为以下几种 单实例单应用 单实例多应用 多实例单应用 多实例多应用 实例的概念可以理解为上面说的一个 Tomcat 目录 单实例单应用 比较常用的一
  • Python3.x opencv操作中文文件

    我用的是python3 5 本身用file打开中文文件是没有问题的 但是用opencv就不行 网上看到很多解决版本 可能都是针对python2 x的 没有效果 后来在知乎上看到一个解决方法 测试有效 引用在这里 冯卡门 由于python3字
  • Redis底层数据结构.md

    1 Redis 概述 Redis 数据库里面的每个键值对 key value 都是由对象 object 组成的 数据库键总是一个字符串对象 string object 数据库的值则可以是字符串对象 列表对象 list 哈希对象 hash 集
  • Jmeter对图片验证码的处理

    jmeter对图片验证码的处理 在web端的登录接口经常会有图片验证码的输入 而且每次登录时图片验证码都是随机的 当通过jmeter做接口登录的时候要对图片验证码进行识别出图片中的字段 然后再登录接口中使用 通过jmeter对图片验证码的识
  • ctfshow—萌新—web1

    0x00 前言 CTF 加解密合集 CTF Web合集 0x01 题目 0x02 Write Up 解法1 标准的数字型注入 查列名 http cc3ecc3f 8c42 4624 979e 277a51ea85d2 challenge c
  • 【面经】外企德科-华为精英研发项目-笔试编程题

    微信搜索 编程笔记本 获取更多干货 微信搜索 编程笔记本 获取更多干货 点击上方蓝字关注我 我们一起学编程 欢迎小伙伴们分享 转载 私信 赞赏 今天来看一道 外企德科 华为精英研发项目 的一道笔试编程题 求满足条件的最长字串的长度 题目描述
  • 一次 Young GC 的优化实践

    这个 GC 案例比较有意思 排查问题有点像侦探断案 先分析各种可能性 再按照获得的一个个证据 去排除各种可能性 然后定位原因 最终解决问题 问题 某同学在微信上问我 有没有办法排查 YoungGC 效率低的问题 听到这话 我也是不知从何说起
  • Linux网络编程:Socket套接字编程(Server服务器 Client客户端)

    文章目录 一 定义和流程分析 1 定义 2 流程分析 3 网络字节序 二 相关函数 IP地址转换函数inet pton inet ntop 本地字节序 网络字节序 socket函数 创建一个套接字 bind函数 给socket绑定一个服务器
  • 引领AI数据标注行业,景联文科技提供高质量图像和文本标注服务

    近年来 我国的数据要素市场呈现出高速增长的趋势 根据国家工信安全中心的统计数据 截至2022年 我国数据要素市场规模已达到815亿元 同比增长49 51 数据要素作为数字经济时代的关键要素 是构建新发展格局的重要支撑 其重要性日益凸显 党中
  • Android开发学习之路-基本事件的使用

    1 事件的响应方法 setOnClickListener view OnClickListener l setOnFocusChangeListener view OnFocusChangeListener l setOnLongClick
  • [从零开始学习FPGA编程-37]:进阶篇 - 基本时序电路-有限状态机实现(Verilog)

    作者主页 文火冰糖的硅基工坊 文火冰糖 王文兵 的博客 文火冰糖的硅基工坊 CSDN博客 本文网址 目录 第1章 状态机概述 1 1 UML描述状态机 1 2 数字电路描述状态机
  • VScode的代码截图插件CodeSnap

    CodeSnap 在 VS Code 中为您的代码截取漂亮的屏幕截图 插件名 CodeSnap 官方地址 CodeSnap Visual Studio Marketplace 特征 快速保存代码的屏幕截图 将屏幕截图复制到剪贴板 显示行号
  • user-select不可被用户选中

    目录 背景 字段属性 注意 案例 背景 项目中有这种奇葩需求 就是特定字段不让用户复制 不可被选中状态 这种应用场景最多的就是考试系统啥的吧 不让考生复制题目搜题 真恶心 字段属性 注意 浏览器实现之间的区别之一是继承 案例
  • 我用Python做副业,月赚1W+:千万别让死工资拖垮了自己。。

    被压垮的打工人 你还好吗 房贷车贷 上老下小 日常开销节省不了 但你的收入有多少 所以不敢生病 甚至不敢回家 就为了每个月那么点死工资 还得天天加班 然而忙忙忙 却变成了 穷忙族 成为了职场废人 其实很多人都想改变现状 想学点什么的 但就是
  • Proxy error: Could not proxy request错误解决

    vue 项目 错误原因 跨域 解决办法 package json文件中的scripts调试添加 start node index js server nodemon index js ignore client 这篇文章解释的很清楚http
  • 二叉排序树转化成双向链表

    题目描述 输入一棵二叉搜索树 将该二叉搜索树转换成一个排序的双向链表 要求不能创建任何新的结点 只能调整树中结点指针的指向 输入 输入可能包含多个测试样例 对于每个测试案例 输入的第一行为一个数n 0

随机推荐

  • 浅谈Spring-AOP

    HI 大家好 我是Lee 这篇文章我们主要说一下关于Spring AOP 什么是AOP 什么叫做面向切面编程 为什么要使用AOP 接下来让我们往下看 什么是AOP AOP为Aspect Oriented Programming的缩写 意思为
  • Lua基础之语法

    目录 1 输出2 注释3 控制语句4 赋值语句5 运算符6 关键字7 变量类型8 其他 原文地址http blog csdn net dingkun520wy article details 49930543 1 输出 print Hell
  • ubuntu16.04 开启ssh服务

    安装 sudo apt get install openssh server 启动 sudo service ssh start 查询服务启动状态 sudo ps e grep ssh 或者 sudo service ssh status
  • R绘图的文本大小,字体字号,字样,图形边界设置及坐标轴

    用于指定文本大小的参数 cex 表示相对于默认大小缩放倍数的数值 默认大小为1 1 5表示放大为默认值的1 5倍 0 5表示做小为默认大小的0 5倍 cex axis 坐标轴刻度文字的缩放倍数 类似cex cex lab 坐标轴标签 名称
  • markdown插入音频和视频

    优酷视频 width 560 height 315 src http player youku com embed XMzk1NTkwODkzNg allowfullscreen gt 爱奇艺视频 音乐1 border 0 width 33
  • 3DMAX 卸载工具,完美彻底卸载清除干净3dmax各种残留注册表和文件

    一些同学安装3dmax出错了 也有时候想重新安装3dmax的时候会出现这种本电脑windows系统已安装3dmax 你要是不留意直接安装 只会安装3dmax的附件 3dmax是不会安装上的 这种原因呢就是大家在之前卸载3dmax时没有吧3d
  • 中国联通卡上在苹果5上显示无服务器,苹果iPhone8显示无服务怎么办

    2019 10 11阅读 85 您可以通过以下方式下载壁纸 1 使用浏览器下载符合手机屏幕分辨率的壁纸保存至手机相册 2 使用第三方软件下载主题壁纸并安装 3 通过电脑下载喜欢的壁纸图片 通过数据线传输到手机中 2019 10 11阅读 9
  • Spring Boot 单体应用一键升级成 Spring Cloud Alibaba

    背景 随着 Apache Dubbo Nacos 以及 Spring Cloud 等服务框架的流行 越来越多的企业开始采用微服务架构来构建其应用程序 微服务架构使企业能够将其应用程序拆分成多个小型服务 这些服务可以独立部署和扩展 这种架构模
  • 操作系统 --- 进程/线程 同步

    操作系统 进程 线程 同步 资源竞争 race condition 临界区 critical section 解决临界区问题 实现进程同步 进程同步的三个原则 互斥 mutual exclusive 有限等待 bounded waiting
  • Basic Level 1024 科学计数法 (20分)

    题目 科学计数法是科学家用来表示很大或很小的数字的一种方便的方法 其满足正则表达式 1 9 0 9 E 0 9 即数字的整数部分只有 1 位 小数部分至少有 1 位 该数字及其指数部分的正负号即使对正数也必定明确给出 现以科学计数法的格式给
  • java agent技术原理及简单实现

    注 本文定义 在函数执行前后增加对应的逻辑的操作统称为MOCK 1 引子 在某天与QA同学进行沟通时 发现QA同学有针对某个方法调用时 有让该方法停止一段时间的需求 我对这部分的功能实现非常好奇 因此决定对原理进行一些深入的了解 力争找到一
  • 循环和数据的操作命令

    while循环的本质就是让计算机在满足某一条件的前提下去重复做同一件事情 即while循环为条件循环 包含 1 条件计数循环 2条件无限循环 1 1计数循环 count 0 while count lt 9 print the loop i
  • Vue前端框架

    一 简介 Vue是一个渐进式 真正用到才引用 的JavaScript框架与其它大型框架不同的是 Vue 被设计为可以自底向上逐层应用 Vue 的核心库只关注视图层 不仅易于上手 还便于与第三方库或既有项目整合 另一方面 与现代化的工具以及各
  • Android相机调用-CameraX【外接摄像头】【USB摄像头】

    Android相机调用有原生的Camera和Camera2 我觉得调用代码都太复杂了 CameraX调用代码简洁很多 说明文档 https developer android com jetpack androidx releases ca
  • 一文弄懂c/c++编译过程(预处理,编译,汇编,链接)

    目录 1 为什么要编译 2 编译过程 3 实验验证 1 为什么要编译 c语言是一门高级语言 需要编译器将其转换成计算机能理解的机器语言 才能在计算机上执行 编译的过程就是将c语言代码转换成汇编代码文件的过程 2 编译过程 程序从代码编译成可
  • 关于时间序列分析的协整检验、脉冲响应图、方差分解图和格兰杰因果检验

    1 关于时间序列中分的析过程 step1 单位根检验 一般来说 时间序列进行分析之前应该先检验是否存在单位根 如是 则需要进行差分转换 否则可以直接进行var vector autoregression 这里不讨论arma Autoregr
  • 【mysql】mysql启动关闭命令以及一些报错解决问题

    mysql启动关闭命令以及一些报错解决问题 1 利用cmd窗口启动mysql出现服务名无效 2 启动mysql出现发生系统错误 5 1 利用cmd窗口启动mysql出现服务名无效 利用net start mysql启动mysql报错 服务名
  • Vue如何实现权限管理

    一 权限管理 权限管理就是让不同的用户只能访问自己权限内的资源 有以下几种 路由权限 用户登录后只能看到自己权限内的导航菜单 且只能访问自己权限内的路由地址 视图权限 用户只能看到自己权限内的内容和按钮 请求权限 越权请求将其拦截 二 控制
  • 云原生之使用Docker部署h5ai文件展示页

    云原生之使用Docker部署h5ai文件展示页 一 h5ai介绍 二 检查本地docker服务 1 检查系统docker状态 2 检查docker版本 三 下载h5ai镜像 四 部署h5ai服务 1 创建数据挂载目录 2 创建h5ai容器
  • ajax中XMLHttpRequest对象详解

    ajax中XMLHttpRequest对象详解 ajax技术的核心或者说负责ajax进行同步或者异步服务器请求是XMLHttpRequest对象 在用使用ajax技术时 其实就是操作XMLHttpRequest进行相应的业务 方法 1创建X