对xmlHttp对象方法和属性的理解


Posted in Javascript onJanuary 17, 2011

1  客户端可以通过xmlHttp对象(MSXML2.XMLHTTP.3.0)向http服务器发送请求并使用文档对象模型(DOM)处理回应。

1.1 我的理解:

  1. 用户的每次操作,都会有数据产生。
  2. 通过DOM或者JS编写对数据进行封装,或者浏览器自身对http协议的一些数据进行封装。
  3. 通过xmlHttp对象的一些方法,传入数据参数,向http服务器发送请求。
  4. 返回结果通过DOM进行处理。

2  xmlHttp对象的成员。

2.1 属性

  1. onreadystatechange:readyState属性值发生改变时,触发的事件处理句柄。

例子:xmlHttp.onreadystatechange = functionHandler;

   function functionHandler() {

if(xmlHttp.readyState == 4) {

alert("readyState状态为4时,弹出此窗口!!!");

}

  }

//句柄只有方法名称,没有这对“()”括号。赋值时要注意理解。

  1. readyState:这个属性表示状态;总共有五种状态:
0 (未初始化) 对象已建立,但是尚未初始化(尚未调用open方法)
1 (初始化) 对象已建立,尚未调用send方法
2 (发送数据) send方法已调用,但是当前的状态及http头未知
3 (数据传送中) 已接收部分数据,因为响应及http头不全,这时通过responseBody和responseText获取部分数据会出现错误,
4 (完成) 数据接收完毕,此时可以通过通过responseBody和responseText获取完整的回应数据

// 因为xmlHttp的编写方式固定,因此每一个步骤都会伴随着状态的改变,因此时刻监听事件处理句柄,执行相应的逻辑。

代码执行顺序:

var  xmlHttpReq = new ActiveXObject("MSXML2.XMLHTTP.3.0");

xmlHttpReq.open("GET", "http://localhost/test.xml", false);

xmlHttpReq.send();

alert(xmlHttpReq.responseText);

 

2.2 方法

  1. open(Method, Url, Syn, User, Password);

创建一个新的xmlHttp对象时,实际上就是创建一个http请求。

此方法指定请求的方式(GET/POST/PUT/PROPFIND) URL、异步(默认情况为true)、验证信息。

采用异步方式(true)时,状态改变时会调用onreadystatechange属性指定的回调函数。

  1. send();

此方法的同步或异步方式取决于open方法中的Syn参数,如果Syn == false,此方法将会等待请求完成或者超时时才会返回,如果Syn == true,此方法将立即返回。

Javascript 相关文章推荐
javascript 获取select下拉列表值的代码
Sep 07 Javascript
jQuery Ajax之load()方法
Oct 12 Javascript
js 效率组装字符串 StringBuffer
Dec 23 Javascript
100个不能错过的实用JS自定义函数
Mar 05 Javascript
JS动态加载脚本并执行回调操作
Aug 24 Javascript
knockoutjs动态加载外部的file作为component中的template数据源的实现方法
Sep 01 Javascript
Jquery on绑定的事件 触发多次实例代码
Dec 08 Javascript
AngularJS通过ng-route实现基本的路由功能实例详解
Dec 13 Javascript
详解Web使用webpack构建前端项目
Sep 23 Javascript
简化版的vue-router实现思路详解
Oct 19 Javascript
在NPM发布自己造的轮子的方法步骤
Mar 09 Javascript
Vue实现按钮级权限方案
Nov 21 Javascript
Grid得到选择行数据的方法总结
Jan 17 #Javascript
JS中confirm,alert,prompt函数区别分析
Jan 17 #Javascript
JavaScript flash复制库类 Zero Clipboard
Jan 17 #Javascript
C#中TrimStart,TrimEnd,Trim在javascript上的实现
Jan 17 #Javascript
js 数据类型转换总结笔记
Jan 17 #Javascript
简短几句 通俗解释javascript的闭包
Jan 17 #Javascript
javascript 内存回收机制理解
Jan 17 #Javascript
You might like
ThinkPHP CURD方法之data方法详解
2014/06/18 PHP
php简单分页类实现方法
2015/02/26 PHP
PHP合并discuz用户脚本的方法
2015/08/04 PHP
laravel框架实现去掉URL中index.php的方法
2019/10/12 PHP
解决tp5在nginx下修改配置访问的问题
2019/10/16 PHP
PhpStorm 如何优雅的调试Hyperf的方法步骤
2019/11/24 PHP
javascript之对系统的toFixed()方法的修正
2007/05/08 Javascript
经典海量jQuery插件 大家可以收藏一下
2010/02/07 Javascript
location.search在客户端获取Url参数的方法
2010/06/08 Javascript
json数据的列循环示例
2013/09/06 Javascript
Extjs中RowExpander控件的默认展开问题示例探讨
2014/01/24 Javascript
JavaScript 实现简单的倒计时弹窗DEMO附图
2014/03/05 Javascript
IE下通过a实现location.href 获取referer的值
2014/09/04 Javascript
JavaScript通过事件代理高亮显示表格行的方法
2015/05/27 Javascript
jQuery 更改checkbox的状态,无效的解决方法
2016/07/22 Javascript
微信小程序中的onLoad详解及简单实例
2017/04/05 Javascript
vue自定义全局组件(自定义插件)的用法
2018/01/30 Javascript
vue.js移动数组位置,同时更新视图的方法
2018/03/08 Javascript
jquery ajax加载数据前台渲染方式 不用for遍历的方法
2018/08/09 jQuery
JavaScript引用类型RegExp基本用法详解
2018/08/09 Javascript
Phaser.js实现简单的跑酷游戏附源码下载
2018/10/26 Javascript
Vue项目中使用flow做类型检测的方法
2020/03/18 Javascript
基于element-ui封装表单金额输入框的方法示例
2021/01/06 Javascript
python下读取公私钥做加解密实例详解
2017/03/29 Python
使用Python写一个小游戏
2018/04/02 Python
Python opencv实现人眼/人脸识别以及实时打码处理
2019/04/29 Python
python3.7 使用pymssql往sqlserver插入数据的方法
2019/07/08 Python
Python 序列化和反序列化库 MarshMallow 的用法实例代码
2020/02/25 Python
网络技术专业求职信
2014/05/02 职场文书
平安工地汇报材料
2014/08/19 职场文书
成本会计实训报告
2014/11/05 职场文书
父亲节寄语大全
2015/02/27 职场文书
《童年的发现》教学反思
2016/02/18 职场文书
MySQL中出现乱码问题的终极解决宝典
2021/05/26 MySQL
Python进程间的通信之语法学习
2022/04/11 Python
Win11任务栏无法正常显示 资源管理器不停重启的解决方法
2022/07/07 数码科技