回收站不见了-笑傲江湖黑屏

msxml 6 0
2023年4月1日发(作者:rocketdock怎么用)

在Ajax应用程序中,XmlHttpRequest对象负责将用户信息以异步通信地发送到服务器端,

并接收服务器返回的响应信息和数据。

XMLHttpRequest简介

XMLHttpRequest可以提供不重新加载页面的情况下更新网页,在页面加载后在客户端向服务

器请求数据,在页面加载后在服务器端接受数据,在后台向客户端发送数据。XMLHttpRequest

对象提供了对HTTP协议的完全的访问,包括做出POST和HEAD请求以及普通的GET请求

的能力。XMLHttpRequest可以同步或异步返回Web服务器的响应,并且能以文本或者一个

DOM文档形式返回内容。尽管名为XMLHttpRequest,它并不限于和

XML文档一起使用:它可以接收任何形式的文本文档。XMLHttpRequest对象是名为AJAX的

Web应用程序架构的一项关键功能。

XMLHttpRequest和Javascript

Javascript本身并未具备向服务器发送请求的能力,要么使用()方法重新打开

一个页面向服务器提交请求,要么使用XMLHttpRequest对象发送请求。不同的是,前者是普

通的即同步交互模式,而后者是异步交互方式。

XMLHttpRequest提供了一系列的属性和方法,来向服务器发送异步的http请求;在服务器

处理用户请求的过程中,XMLHttpRequest通过属性的状态值来实时反映http请求所

处的状态,并根据这些状态指示Javascript做相应的处理;当服务器顺利完成响应用户行为

的动作、并将响应数据返回时,XMLHttpRequest提供的response系列方法,可以将这些响

应数据以文本、XMLDocument对象、AdoStream对象或者unsigned

byte数组的方式组装起来,提供给Javascript处理。

XMLHttpRequest的五步使用法:

1、建立XMLHttpRequest对象

2、注册回调函数

3、使用open方法社会自和服务器端交互的基本信息

4、设置发送的数据,开始和服务器端交互

5、在回调函数中判断交互是否结束,响应是否正确,并根据需要过去服务器端返回的数据,

更新页面内容

下面我们以用户名确认来实现XMLHttpRequest的五步使用法:

<!DOCTYPEhtml>

<html>

<head>

<title></title>

<metahttp-equiv="Content-Type"content="text/html;

charset=UTF-8">

<scripttype="text/javascript">

varxmlhttp;

functionsubmit(){

//1.创建XHLHttpRequest对象

if(pRequest){

//alert("IE7,IE8,FireFox。Mozillar、Safari,Opera");

//IE7,IE8,FireFox。Mozillar、Safari,Opera

xmlhttp=newXMLHttpRequest();

if(deMimeType){

deMimeType("text/xml");

}

}elseif(XObject){

//IE6,IE6.5IE5

alert("IE6,IE6.5IE5");

varactivexName=['P.6.0','P.5.0',

'P.4.0','p.3.0','P.2.0',

'P.1.0'];

for(vari=0;i<;i++){

try{

xmlhttp=newActiveXObject(activexName[i]);

break;

}catch(e){

}

}

}

if(xmlhttp==undefined||xmlhttp==null){

alert("当前浏览器不支持穿件XMLHttpRequest对象,请更换

浏览器");

return;

}

//alert(xmlhttp);

//2.注册回调方法

ystatechange=callback;

//错误的写法callback();

//记忆一个固定用法,获取文本框中用户输入的内容

var

userName=mentById("UserName").value;

/*

//GET方式交互

//设置和服务器端交互的相应参数

("GET","AjaxServer?name="+userName,true);

//4.设置向服务器端发送的数据,启动和服务器端的交互

(null);

*/

//POST方式交互

//3.设置和服务器端交互的相应参数

("POST","AjaxServer",true);

//POST方式交互所需要增加的代码

uestHeader("Content-Type","application/x-www-form-u

rlencoded");

//4.设置向服务器端发送的数据,启动和服务器端的交互

("name="+userName);

}

functioncallback(){

//5.判断和服务器端的交互是否完成,还有判断服务器端是否正确返回了

数据

if(tate==4){

//表示和服务器端的交互已经完成

//服务器返回的http状态码

//200表示“成功”,404表示“未找到”。500表示“服务器内容部错误”

//alert();

if(==200){

//表示服务器端的响应代码是200,正确的返回了数据

//纯文本数据的接受方法

varmessage=seText;

//XML数据对应的DOM对象的接受方法

//使用前提是,服务器端需要设置content-type为text/xml

//vardomXml=seXML;

alert("bb");

//记忆想div标签填充文本内容的方法

vardiv=mentById("message");

TML=message;

}

(参考:)}

}

</script>

</head>

<body>

<inputtype="text"id="UserName"/>

<inputtype="button"value="校验用户名"

onclick="submit()"/>

<br/>

<divid="message"></div>

</body>

</html>

XMLHttpRequest的详细属性和方法

方法和属性

描述

Open(Stringmethod,Stringurl,Booleanansynch,Stringusername,Stringpassword)

指定和服务器端交互的HTTP方法,URL地址及其他请求信息。

其中method表示HTTP请求方法。支持所有HTTP的方法,一般使用“GET”,“POST”url表

示请求的服务器的地址

Asynch表示是否采取异步方式,true表示异步,false表示同步

后两个参数可以不指定,usrename和password分别表示用户名和密码,提供http认证机制

需要的用户名和密码

Send(content)

向服务器发出请求,如果采用异步方式,该方法会立即返回

Content可以不指定或者指定为null表示不发送数据

其内容可以使DOM对象,输入流或是字符串

setRequestHeader(Stringheader,Stringvalue)

设置HTTP请求中的指定头部header的值为value。

次方法需在open方法以后调用

getAllReponseHeader()

返回包含HTTP的所有响应头包括Content-Length,Date,URI等内容

返回值是一个字符串,包含所有头信息,其中每一个键名和键值用冒号分开,

每一组键之间用CR和LF(回车加换行符)来分隔

GetResponseHeader(Stringheader)

返回HTTP响应头中指定的键名header对应的值

Abort()

停止当前http请求,对应的XMLHttpRequest对象会复位到未初始化的状态

responseText

服务器响应的文本内容

ResponseXML

服务器响应的XML内容对应的DOM对象

Status

服务器返回的http状态码

200表示“成功”,404表示“未找到”。500表示“服务器内容部错误”

statusText

服务器返回状态码的文本信息

readyState

表示XMLHttpRequest对象的状态

0=未初始化。对象已创建,未调用open

1=open方法成功调用以后。Send方法未调用

2=send方法已经调用,尚未开始接受数据

3=正在接受数据。Http响应头信息已经接受,响应数据尚未接受完成。

4=完成。响应数据接受完成。

Onreadystatechage

请求状态改变的时间触发器(readyState变化时会调用这个属性上注册的javascript函数)

XMLHttpRequest的五步使用注意事项:

1.不同浏览器中XMLHttpRequest对象建立的方式不同:

IE7,IE8,FireFox,Mozilla,Safair,Opera中直接newXMLHttprequest()

IE6,IE5.5,IE5则需要通过某一个正确的ActiveXOject控件的名称通过newActiveXObject

(控件名)的方式

2.设置回调函数时,不要在函数名后面加括号。加口号表示将回调函数的返回值注册

给onreadystatechange属性。正确的方式应该是将回调函数的名字注册给这个属性。

实际上每次readySatte的值发生变化的时候,回调函数都会被调用,但是一般我们只

关心状态4.

如果只关心正确的响应数据,只要在执行send方法之前设置回调函数即可。但是仍然建议在

XMLHttpRequest对象创建后就先设置回调函数,这样回调函数还可以处理其他的状态。

方法最多可以有五个参数,其中头三个参数是必须的。

使用GET方式时,请求数据位于url连接中,后面的send方法的参数直接写null就可以使

用POST方式时,open方法后面需要先调用setRequestHeader方法,来设置Content-Type

的值,然后调用send方法,send的参数就是请求的数据。

4.回调函数中,最好将判断readyState和status的两个if条件,分开来写。readyState

的判断条件位于外层,status的位于内层。

假如他们被放到了同一个if条件中,判断数据正常返回页是没有问题的。但是不便于分别处

理服务器端不是200响应的情况和readyState不是4的情况。

5.当服务器端没有正确返回XML数据时,在Javascript中使用responseXML方式获取返回

的XML数据对应的DOM对象时,FireFox和IE的结果是有差别的。

IE获取根元素节点为null,而FireFox获取根元素节点则是一个表示解析错误的元素节点。

XMLHttpRequest的优势:

在不重新加载页面的情况下更新网页

在页面已加载后从服务器请求数据

在页面已加载后从服务器接收数据

在后台向服务器发送数据

所有现代的浏览器都支持XMLHttpRequest对象。比较不好的一点是IE5,6跟IE7,FIREFOX

等浏览器之间有两种不同的XMLHttpRequest对象的实现方法。

更多推荐

msxml 6 0