美文网首页
AJAX学习(一)

AJAX学习(一)

作者: 凹凸曼_ebb9 | 来源:发表于2017-10-29 00:34 被阅读0次

    AJAX出现的背景:

    使Web应用程序有桌面应用程序所具有的特征,实现较强的交互性。

    AJAX技术的特点:

    异步性,它不会打断用户当前的操作,用户不需要等待服务器的响应,就可以继续浏览网页以及输入数据。

    AJAX技术的核心:

    XMLHttpRequest对象,其创建的方法如下:

    var xmlHttp = new XMLHttpRequest()

    需要注意的是,任何JavaScript对象都要考虑不同浏览器之间的兼容性。XMLHttpRequest对象也不例外,因此对于使用特殊处理器处理XML的浏览器,比如IE浏览器,就需要在代码中做特殊判断。

    XMLHttpRequest对象在Web程序中的用途:

    XMLHttpRequest对象在Web中主要负责两个方面的工作:(1)一方面是向服务器发出请求。(2)另一方面是从服务器端得到和处理响应。

    向服务器端发送请求代码的基本步骤:

    xmlHttp.open("GET", url, true);                                                                     #连接一个服务器

    xmlHttp.onreadystatechange = updatepage;                                                #构建一个回调函数

    xmlHttp.send(null);                                                                                         # 向服务器发送数据

    XMLHttpRequest详解:

    1.XMLHttpRequest对象的属性

    (1)readyState:XMLHttpRequest把一个http请求发送给服务器端后的状态值

    0:未初始化状态,已经创建了一个XMLHttpRequest对象,但是还未进行初始化

    1:描述一种“发送”状态,代码已经调用了XMLHttpRequest open()方法并已经准备好把一个请求发送到服务器

    2:描述一种“发送状态”,此时,已经通过send()方法把一个请求发送到服务器端,但是还未收到一个响应

    3:描述一种“正在接收”的状态,已经收到http响应头部信息,但消息体还没有完全接收结束

    4:描述一种“已加载”状态,此时响应已经被完全接收

    (2)onreadystatechange事件:无论readyState何时发生改变,都会激发一个onreadystatechange事件。

    (3)responseText属性:只有当readyState为4时,才包含完整的响应信息,否则responseText为空。

    (4)status属性:描述HTTP的状态码,只有当readyState为3或4时才可用,当readyState小于3时调用会报错。

    (5)statusText:描述HTTP状态代码文本。

    2.XMLHttpRequest对象的方法

    (1)abort()方法:暂停一个XMLHttpRequest对象和服务器的连接,将其恢复到初始化状态。

    (2)open()方法:初始化一个XMLHttpRequest对象,并将对象的responseText,responseXML,status和stausText属性恢复为它们的初始值状态。

    (3)send()方法:通过调用open()方法准备好一个请求之后,需要把该请求发送到服务器,当readyState值为1时,才可调用send()方法。

    (4)setRequestHeader()方法:用于设置请求的头部信息。

    (5)getResponseHeader()方法:用于检索响应的头部值。

    (6)getAllResponseHeader()方法:以一个字符串形式返回所有的响应头部。

    在XMLHttpRequest对象中,最为核心的两个属性是status和onreadystatechange,最为核心的两个方法为open和send。

    相关文章

      网友评论

          本文标题:AJAX学习(一)

          本文链接:https://www.haomeiwen.com/subject/yhsepxtx.html