XMLHttpRequest对象。能够让ajax程序在不又一次载入的页面的情况下更新页面数据,页面载入完毕后从server接受发生数据。这样既减轻了server负担又回顾了响应速度,缩短了用户的等待时间,让web程序更类似于传统的桌面应用。

XMLHttpRequest对象4步用法:

1.建立XMLHttpRequest对象。

建立XMLHttpRequest对象时。要依据浏览器的不同版本号去建立,由于IE5.0和iE6.0,开发者就能够在WEB页面内部使用XMLHTTP
ActiveX组件扩展自身的功能;而从IE7版本号以上以及其它厂商的浏览器,開始创建继承XML的代理类XMLHttpRequest,所以创建上会有不同。

         var xmlhttp;//定义全局变量   
<span style="white-space:pre">	</span>//1.创建xmlhttprequest对象
if (window.XMLHttpRequest) {
//firefox等其它浏览器、ie7、8及以上版本号适用
xmlhttp = new XMLHttpRequest();
if (xmlhttp.overrideMimeType) {
xmlhttp.overrideMimeType("text/xml");
} else if (window.ActiveXObject) {
//ie5、6版本号版本号适用
var activexName = ["MSXML2.XMLHTTP.6.0", "MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0","MSXML2.XMLHTTP","Miscrosoft.XMLHTTP"];
for (var i = 0; i < activexName.length; i++) {
try {
xmlhttp = new ActiveXObject(activexName[i]);
break;
} catch (e) { }
}
}
if (xmlhttp==undefined || xmlhttp==null) {
alert("当前浏览器不支持创建xmlhttprequest对象");
return;
}

2.注冊回调函数

                //2.注冊一个回调方法
xmlhttp.onreadystatechange = callback;

3.使用open方法设置和server交互的信息,并设置发送的数据。

open方法中的也有get和post的提交方式。

post的方式时。要设置它的头文件。而且须要发送时须要将參数写的send中

                //GET方式交互
//3.设置和server交互的对应參数
xmlhttp.open("GET", "HtmlPage1.ashx? username=" + userName, true);
////设置server端发送的数据。启动和server的交互
xmlhttp.send(null);
                //POST方式交互
//3.利用open,设置和server交互的对应參数
xmlhttp.open("POST", "HtmlPage1.ashx", true);
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); //POST方式所须要添加的代码,头文件
//设置server端发送的数据。启动和server的交互。以及传递參数
xmlhttp.send("username=" + userName);

4.在回调函数中推断交互是否完毕,响应是否正确,并依据须要获取server端返回的数据,更新页面内容。

                //回调函数
function callback()
{
//5.推断和server器的交互是否完毕,server端是否正确返回了数据
if (xmlhttp.readyState == 4) {//表示server端的交互已经完毕
if (xmlhttp.status == 200) {//表示正确的返回了数据
//纯文本的方法接受方法
var message = xmlhttp.responseText;
//xml数据相应的dom对象的接受方法
//使用的前提是,server端须要设置
//记忆向div标签中加入文本内容
var div1 = document.getElementById("message");
div1.innerHTML = message;
}
}
}

XMLHttpRequest的具体属性和方法:

open() 指定server端交互的http方法(post or get)、url地址、是否异步等信息
send() 向server发出请求。假设採用异步。该方法马上返回。其内容能够是null。dom对象。输入流。字符串
setRequestjeader() 设置http的头文件,在open方法以后调用。

getallResponseHeaders() 包括http的全部对应头文件信息。
getResponseHeader() 返回http相应头文件里指定的键名header相应值。
abort() 停止当前http请求,相应的xmlhttprequest对象复位到未初始化的状态
readyState 异步操作的状态:未初始化(0),正在载入(1)。已载入(2)。交互(3)。已完毕(4)
onreadystatechange() 请求状态改变的事件触发器。

(可注冊函数)

responseText server响应的文本内容。
responseXML server响应的XML内容相应的DOM对象
status server返回的HTTP状态码。200成功。
statusText server返回状态码的文本信息

总结:

在Ajax应用程序中,XMLHttpRequest对象负责将用户信息以异步通信地发送到server端。并接收server响应信息和数据。

ajax——XMLHttpRequest的更多相关文章

  1. 【02】AJAX XMLHttpRequest对象

    AJAX XMLHttpRequest对象   XMLHttpRequest 对象用于与服务器交换数据,能够在不重新加载整个网页(刷新)的情况下,对网页进行部分更新. XMLHttpRequest 对 ...

  2. 异步访问技术Ajax(XMLHttpRequest)

    目录 AJAX XMLHttpRequest Ajax向服务器发送请求 Ajax接收服务器响应 AJAX - onreadystatechange 事件 使用 Callback 函数 一次Ajax请求 ...

  3. ajax+XMLHttpRequest里的FormData实现图片异步上传

    发这篇博客的时候我是自己在研究这个XMLHttpRequest请求,在别人的博客上面知道XMLHttpRequest新加了一个FormData的东西,好像现在APP请求后台也有用这种方式的吧. 别的不 ...

  4. Ajax&XMLHttpRequest

    XMLHttpRequest 简单省力的方法 将文件编码成base64通过Ajax上传 HTML5学习之FileReader接口 HTML5学习之FileReader接口 通过Ajax方式上传文件,使 ...

  5. 不同浏览器创建 ajax XMLHTTPRequest对象的方法及兼容性问题总结

    XMLHttpRequest 对象是AJAX功能的核心,要开发AJAX程序必须从了解XMLHttpRequest 对象开始. 了解XMLHttpRequest 对象就先从创建XMLHttpReques ...

  6. 原生Ajax XMLHttpRequest对象

    一.Ajax请求 - 现在常见的前后端分离项目中,一般都是服务器返回静态页面后浏览器加载完页面,运行script中的js代码,通过ajax向后端api发送异步请求获取数据,然后调用回调函数,将数据添加 ...

  7. 【转载并整理】AJAX XmlHttpRequest对象详解

    一. XMLHttpRequest由来及原生介绍 XMLHttpRequest(XHR)是一个API对象,其中的方法可以用来在浏览器和服务器端传输数据.这个对象是浏览器的js环境提供的.从XHR获取数 ...

  8. AJAX——XMLHttpRequest对象的使用

    AJAX是web2.0即动态网页的基础,而XMLHttpRequest对象又是AJAX的核心.XMLHttpRequest对象负责将用户信息以异步通信地发送到服务器端,并接收服务器响应信息和数据 一. ...

  9. java 设置允许ajax XMLHttpRequest 请求跨域访问

    怎样才能算跨域?协议,域名,端口都必须相同,才算在同一个域. 方案1: 使用XMLHttpRequest...  异步请求不能跨域访问,除非要访问的网页响应头信息设置为允许跨域访问. 将网页设置为允许 ...

随机推荐

  1. ActiveX控件开发 C#

    转自:http://hi.baidu.com/charlesx_kst/item/9c2f42e2920db3f42b09a4ff 前言: 这段时间因为工作的需要,研究了一下ActiveX控件.总结如 ...

  2. c++ 常识

    1)  功能:格式化字符串输出    说明:format指定输出格式,后面跟要输出的变量        目前printf支持以下格式:          %c        单个字符          ...

  3. Docker---(1)Docker 简介

    原文:Docker---(1)Docker 简介 版权声明:欢迎转载,请标明出处,如有问题,欢迎指正!谢谢!微信:w1186355422 https://blog.csdn.net/weixin_39 ...

  4. 如何安装Python环境以及为Visual Studio 2012安装Python插件

    (一)首先,我机器上的开发环境安装的是Visual Studio 2012版本,系统为window7,64位,要安装的Python版本为python3.4-x64,双击安装包安装Python环境,需要 ...

  5. NodeJS服务端重构计划

    不知不觉做node开发已经半年时间了.这期间写尝试着去攻克了一些问题.实现了一下想法,也遇到过一些坑. 是时候来梳理一下代码,规划一下接下来的工作. 现阶段我们的nodeserver端代码结构是这种: ...

  6. iOS_05_iOS设备发展史

    ios设备发展史 IPhone一代 * 2007年发布. * 支持电子邮件.移动电话.短信.网络浏览等. * 采取触摸键盘 * 3.5英寸,480 x 320像素. * 后置摄像投200万像素. IP ...

  7. Windows中DLL文件的意义及其作用

    Windows中DLL文件的意义及其作用 DLL是Dynamic Link Library的缩写,意为动态链接库.DLL文件即动态链接库文件,是一种可执行文件,它允许程序共享执行特殊任务所必需的代码和 ...

  8. 苹果APNS在app中的详细实现

    鉴于server稳定的开发难度非常大,小团队不建议自己开发.建议使用稳定的第三方推送方案,如个推,蝴蝶等. 要想使用苹果APNS推送消息,首先要把开发app的xcode所用证书上传到server上,当 ...

  9. js进阶ajax的XMLHttpRequest对象的status和statustext属性(如果ajax和php联合使用的话:open连接服务器的第二个参数文件路径改成请求php的url即可)

    js进阶ajax的XMLHttpRequest对象的status和statustext属性(如果ajax和php联合使用的话:open连接服务器的第二个参数文件路径改成请求php的url即可) 一.总 ...

  10. Linux 如何查看一个进程的堆栈

    有两种方法: 第一种:pstack 进程ID 第二种,使用gdb 然后attach 进程ID,然后再使用命令 thread apply all bt 第三种:strace -f -p pid  该方法 ...