`
Imagination_Fly
  • 浏览: 23165 次
  • 性别: Icon_minigender_1
  • 来自: 山城
社区版块
存档分类
最新评论

Ajax之XMLHTTP学习理解

阅读更多

在.JS文件或者网页中写入如下脚本

//定义XMLHttp实例
var xmlHttp;
function createXMLHttpRequest(){
//开始初始化XMLHttpRequest对象
  if(window.ActiveXObject){
//IE浏览器
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  }else if(window.XMLHttpRequest){
//Mozilla浏览器
    xmlHttp = new XMLHttpRequest();
  }
if(xmlHttp){
    xmlHttp.open("GET",url,false);
    xmlHttp.onreadystatechange=function(){setState(greens,reds,contains)};
    xmlHttp.send(null);
  }
}
//回调函数举例
//返回的4种状态
function setState(greens,reds,contains){
var contains = document.getElementById("contain");
  if(xmlHttp.readyState == 0){
    contains.innerHTML = "正在初始化";
  }
  if(xmlHttp.readyState == 1){
    contains.innerHTML = "正在准备发送请求";
  }
  if(xmlHttp.readyState == 2){
    contains.innerHTML = "正在发送请求";
  }
  if(xmlHttp.readyState == 3){
    contains.innerHTML = "正在接收数据";
  }
  if(xmlHttp.readyState == 4){
//信息已经成功返回,开始处理信息
    if(xmlHttp.status == 200){
   contains.innerHTML = xmlHttp.responstText; //返回值
    }
  }
}

DOM的一些详解

(1)设置
      在从服务器返回数据的同时,还要进行设置,使浏览器不会在本地缓存结果,response.setHeader("Cache-Control","no-cache");response.setHeader("pragma","no-cache");
      XMLHttpRequest对象提供2个可以用来访问服务器响应的属性,一个是responseText将响应提供一个串,结合HTML元素的innerHTML属性,非常有用.(document.getElementById("results").innerHTML=xmlHttp.responseText).一个是responseXML将响应提供为一个XML对象.

      (2)DOM元素的一些有用的属性
  childNodes--------------------------------------返回当前元素所有子元素的数组
  firstChild   --------------------------------------返回当前元素的第一个下级子元素
  lastChild   ---------------------------------------返回当前元素的最后一个子元素
  nextSibling---------------------------------------返回紧跟在当前元素后面的元素
  nodeValue----------------------------------------指定表示元素值的读/写属性
  parentNode --------------------------------------返回元素的父节点
  previousSibling----------------------------------返回紧邻当前元素之前的元素

   (3)用于遍历XML文档的DOM元素方法(document)
  getElementById(id)-----------------------------获取有指定唯一ID属性值文档中的元素
  getElementsByTagName(name)--------------返回当前元素中有指定标记名的子元素的数组
  hasChildNodes()--------------------------------返回一个布尔值,指定元素是否有子元素
  getAttribute(name)------------------------------返回元素的属性值,属性由name指定

      (4)动态创建内容时所用的W3C DOM属性和方法
  document.createElement(tagName)----------文档对象上的createElement方法可以创建由tagName指定的元素
  document.createTextNode(text)--------------文档对象的createTextNode方法会创建一个包含静态文本的节点.
  <element></element>.appendChild(childNode)---------该方法将指定的节点增加到当前元素的子节点列表.
  <element></element>.getAttribute(name)|.setAttribute(name,value)-----------------获得和设置元素中name属性的值
        <element></element>.insertBefore(newNode,targetNode)-----这个方法将节点newNode作为当前元素的子节点插到targetNode元素前面。
        <element></element>.removeAttribute(name)-----这个方法从元素中删除属性name
        <element></element>.removeChild(childNode)-----这个方法从元素中删除子元素childNode
         <element></element>.replaceChild(newNode,oldNode)-----这个方法将节点oldNode替换为节点newNode
          <element></element>.hasChildNodes()这个方法返回一个布尔值,指示元素是否有子元素

XMLHttpRequest对象的一些典型方法

(1)、void open(String method,String url,boolean asynch);这个方法会建立对服务器的调用。
第一个参数表示要提供调用的特定方法(get,post,put)
第二个参数表示要提供所调用资源的url
第三个参数表示是异步(true)还是同步(false)
(2)、void send(content):这个方法会向具体服务器发出请求。可选参数会作为请求体的一部分发送。
(3)、void setRequestHeader(String header ,String value):这个方法为HTTP请求中一个给定的首部设置值
第一个参数表示要设置的首部。
第二个参数表示要 在首部中放置的值。这个方法必须在调用open()之后才能调用。
XMLHttpRequest对象的一些典型属性:
(1)、onreadystatechange:每个状态改变时都会触发这个事件处理器,通常会调用一个javascript函数,用来处理返回时要调用的函数。
(2)、readyState:请求的状态。有5个值:0=未初始化,1=正在加载,2=已经加载,3=交互中,4=完成。
(3)、responseText:服务器的响应,表示为一个串
(4)、responseXML:服务器的响应,表示为一个XML,这个对象可以解析为一个DOM对象。
(5)、status:服务器的Http状态码(200对应ok,404对应Not Found(未找到))

分享到:
评论

相关推荐

    xmlhttp.rar_XMLHTTP delphi_delphi xmlHt_delphi xmlhttp_xmlhttp

    首先,XMLHTTP组件是Windows操作系统内置的MSXML库的一部分,它提供了与HTTP服务器通信的能力,可以发送HTTP请求并接收响应,常用于AJAX(Asynchronous JavaScript and XML)技术中。在Delphi中,可以通过创建...

    Ajax创建XMLHttp对象的完美兼容性代码

    通过分析这些代码,我们学习到了如何编写兼容多种浏览器的Ajax请求,并且理解了早期浏览器兼容性问题的背景及其解决方案。同时,我们也了解到了ActiveX控件及其潜在的安全风险,以及overrideMimeType方法的使用。...

    Ajax获取XMLHttp对象的方法

    此外,对于Ajax的学习者来说,理解XMLHttp对象以及浏览器对它的支持情况是必须的,这有助于学习者更好地掌握Ajax技术,并能够针对不同的浏览器环境编写出正确的代码。同时,这也是对开发者基本功的一个检验,因为在...

    VFP xmlHTTP应用实例

    xmlHTTP对象是XMLHttpRequest的简称,它是浏览器中的一个组件,允许客户端通过JavaScript或其他语言与服务器进行异步数据交换,实现AJAX(Asynchronous JavaScript and XML)技术的核心。在VFP中,我们可以通过创建...

    xmlHttp中文参考手册

    XMLHttp中文参考手册是一部专为Java后台程序员设计的实用指南,旨在帮助开发者更好地理解和运用XMLHttpRequest(通常简称为XMLHttp)这一技术。XMLHttp是AJAX(Asynchronous JavaScript and XML)技术的核心组成部分...

    XMLHTTP API学习总结

    ### XMLHTTP API学习总结 #### 一、XMLHttpRequest概述 **XMLHttpRequest** 是一个用于实现客户端与服务器异步通信的标准接口。它使得网页能够通过JavaScript发起HTTP请求,并且无需重新加载整个页面即可从服务器...

    易语言源码XMLHTTP方式访问网页.rar

    XMLHTTP(全称为XMLHttpRequest)是一种在客户端进行异步HTTP请求的技术,常用于网页的Ajax(Asynchronous JavaScript and XML)开发。在易语言中,我们可以通过内置的网络库来实现XMLHTTP的功能,从而实现与服务器...

    XMLHTTP类模块.rar

    XMLHTTP类模块是用于在后台执行HTTP请求的组件,它主要应用于异步数据通信,特别是在Web开发中...通过深入学习和使用易语言XMLHTTP类模块的源代码,开发者可以更好地掌握异步通信技术,并在自己的项目中实现类似功能。

    Ajax的学习资料

    ### Ajax学习资料精要 Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行...这些知识对于理解 Ajax 工作原理和实现动态网页至关重要。

    从Ajax到JQuery Ajax学习

    ### 从Ajax到jQuery Ajax的学习 #### Ajax技术基础 **Ajax**(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。这种技术通过在后台与服务器进行少量数据交换,...

    XMLhttp中文手册

    XMLHTTP,全称为“XMLHttpRequest”,是Web...通过深入学习“XMLHTTP中文手册”,开发者不仅可以掌握XMLHTTP的基本用法,还能了解其在现代Web开发中的应用和最佳实践,这对于提升Web应用的用户体验和性能具有重要意义。

    XMLHttp

    在AJAX教程.chm文件中,你可能会深入学习到如何创建和使用XMLHttp对象进行异步请求,如何处理请求的生命周期,以及如何解析和展示服务器返回的数据。CHM文件是一种Windows的帮助文档格式,包含了索引、搜索等功能,...

    AJAX手册(XMLHTTP 手册 XMLDOM.chm手册 DHTML.chm手册 Css2.0.chm 手册 Script.chm手册)

    AJAX,全称为Asynchronous JavaScript and XML,是一种在无需刷新整个网页的情况下,能够更新部分网页的技术。...对于希望深入理解AJAX并提升开发技能的开发者来说,这些资源无疑是宝贵的参考资料。

    XMLHTTP.rar_xmlhttp

    XMLHTTP的广泛应用催生了诸如AJAX(Asynchronous JavaScript and XML)等前端开发模式。 在提供的“XMLHTTP 手册.CHM”中,我们可以预见到它将深入讲解XMLHTTP的相关知识,包括但不限于以下几个方面: 1. **...

    XmlHttp.rar_xmlhttp

    然而,由于XmlHttp对象在Ajax的早期发展中扮演了重要角色,理解它的工作原理对于学习前端开发仍然是至关重要的。 总结来说,XmlHttp是实现网页异步通信的关键工具,通过它,开发者可以构建更加互动和高效的Web应用...

    xmlhttp.rar_xmlhttp

    XMLHTTP对象是微软ActiveX组件的一部分,主要用于在后台与服务器进行异步数据交换,它是XMLHttpRequest(XHR)的前身,广泛应用于JavaScript和VBScript中,实现了网页的无刷新更新,即Ajax(Asynchronous JavaScript...

    XMLHTTP类模块源码

    XMLHTTP类模块是用于在易语言环境中实现异步HTTP...通过深入理解XMLHTTP类模块的源码,开发者不仅可以更好地利用这一工具,还能提升对网络通信和异步编程的理解,从而在易语言项目中实现更高效、更灵活的数据交互功能。

    xmlHTTP.rar_xmlhttp_xmlhttp java_xmlhttp下载

    XMLHttpRequest(通常简称为xmlhttp)是Web开发中的一个关键技术,它允许JavaScript在不刷新整个页面的情况下与服务器进行...学习这个内容将有助于提升你的Web开发技能,特别是在构建动态和交互式的Web应用程序方面。

    AJAX学习讲义,教你入门AJAX

    相比之下,AJAX实现了局部刷新,仅更新需要变动的内容,其他部分保持不变,提高了网页的响应速度和效率。 使用AJAX技术有以下几个显著的好处: 1. **异步通信**:AJAX可以发送异步请求,这意味着用户可以继续浏览...

    AJAX 学习文档AJAX 学习文档

    理解AJAX的GET和POST方法是关键: **GET方法**: - GET方式适合发送简单的数据,但通常限制在1KB以内。 - 数据附加到URL中发送,容易被浏览器缓存,可能导致安全问题,例如暴露敏感信息。 - 示例:`var url = ...

Global site tag (gtag.js) - Google Analytics