MLHttpRequest是ajax的核心对象:
通常和服务器进行交互是通过提交表单的形式,而在Ajax中的客户端通过MLHttpRequest对象实现与服务器的通信。XMLHttpRequest对象可以在不向服务器提交整个页面的情况下,实现局部更新网页。当页面全部加载完毕后,客户端通过该对象向服务器请求数据,服务器端接受数据并处理后,向客户端反馈数据。这样我们的与服务器的交互速度明显提升,而且用户体验也明显更好。
XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问,包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。XMLHttpRequest 可以同步或异步返回 Web 服务器的响应,并且能以文本或者一个 DOM 文档形式返回内容。尽管名为 XMLHttpRequest,它并不限于和 XML 文档一起使用:它可以接收任何形式的文本文档。XMLHttpRequest 对象是名为 AJAX 的 Web 应用程序架构的一项关键功能。
XMLHttpRequest对象的五步使用法:
1.建立XMLHttpRequest对象
2.注册回调函数
3.使用open方法设置和服务器端交互的基本信息
4.设置发送的数据,开始和服务器端交互
5.在回调函数中判断交互是否结束,响应是否正确,并根据需要获取服务器返回的数据,更新页面内容
实例:
//1、创建XMLHttpRequest对象 if(window.XMLHttpRequest){ //Mozilla浏览器 xmlhttp=new XMLHttpRequest(); }else{ //IE浏览器 if(window.ActiveXObject){ try{ xmlthttp=new ActionXObject("Msxm12.XMLHTTP"); }catch(e){ try{ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){} } } } //2、注册回调方法 xmlhttp.onreadystatechange=callback; //3、设置和服务器端交互的相应参数 xmlhttp.open("GET","AJAX?name="+userName,true); //4、设置向服务器端发送的数据,启动和服务器的交互 xmlhttp.send(null);
注意事项: 1、不用浏览器中XMLHttpRequest对象建立的方式不同。IE7,IE8,FireFox,Mozilla,Safari,opera中直接new XMLHttprequest(),IE6,IE5.5,IE5则需要通过用某一个正确的ActiveXObject控件的名称通过new ActiveXObject的方式。 2、设置回调函数时,不要在函数名后而加括号。加括号表示将回调函数的返回值注册给onreadystatechange属性。正确的方式应该是将回调函数的名字注册给这个属性。 3.open方法最多可以有五个参数,其中头三个参数是必须的。 使用GET方式时,请求数据位于url链接中,后面的send方法的参数直接写null就可以。 使用post方式时,open方法后而需要先调用setRequestHeader方法,来设置ContentType的值,然后调用send方法,send的参数就是清求的数据。 4.回调函数中,最好将判断readystate和status的两个if条件,分开来写。readystate的判断条件位于外层,statusl位于内层假如他们被放到了同一个if条件中,判断数据正常返回也是没有问题的。但是不便于分别处理服务器端不是200响应的情况和readystate不是4的情况。 5.服务器端没有正确返回XML数据时,在Javascript中使用responseXMLI的方式获取返回的XML数据对应的DOM对象时,FireFox和lE的结果是有差别的。IE获取根元素节点为null,而FireFox获取根元素节点则是一个表示解析错误的元索节点。 原文链接:https://www.f2er.com/ajax/165321.html