ajax本质
|
AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。 ajax作用：在不刷新整个页面情况下，更新部分网页 ajax实质：ajax全部的工作都由一个对象来做，XMLHttpRequest对像(简写xmlhttp) 先给一个简单的使用xmlhttp来发送ajax请求的例子
<html> <head> <script type="text/javascript"> function loadXMLDoc() { var xmlhttp; if (window.XMLHttpRequest) {// code for IE7+,Firefox,Chrome,Opera,Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6,IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } xmlhttp.open("GET","/ajax/test1.txt",true); xmlhttp.send(); } </script> </head> <body> <div id="myDiv"><h2>Let AJAX change this text</h2></div> <button type="button" AJAX 改变内容</button> </body> </html> 创建XMLHttpResponse对象： xmlhttp=new XMLHttpRequest() 是后来的浏览器才支持 更早的用xmlhttp=new ActiveXObject("Microsoft.XMLHTTP") 先用 if(window.XMLHttpRequest) 来判断支持，选择用哪种方式来创建该对象 发送请求： xmlhttp.open() xmlhttp.send() 可以通过open()的参数来配置 是 get 或者 post方式 post和get区别 1 post无法使用缓存 2 get发送参数的长度有限制 3 post比get更安全 分析 1 只能记了 2 get的参数放在url中，url长度有限制 3 post的请求数据放在数据报中，get放在url中 post方法设置请求参数示例： xmlhttp.open("post",url,true); xmlhttp.setRequestHeader("Content-type","application/x-www-from-urlencoded"); xmlhttp.send("fname=Bill&name=Gates"); setRequestHeader()方法 来添加 HTTP 头 至于为什么这样用？ 不知道 响应： xmlhttp.responseText 或者 xmlhttp.resonseXml 也就是说执行完请求以后，如果执行成功，那么不用任何操作，只需要访问xmlhttp的这两个对象即可 访问到响应的结果 就像示例中的这样 document.getElementById("myDiv").innerHTML=xmlhttp.responseText; responseXml与resonseText区别：两者的数据格式是不同的 responseText是字符串，responseXml是xml格式 xmlhttp状态标示： readyState、status、onreadystatechange readyState 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
status： 200: "OK" 404: 未找到页面 onreadystatechange 函数，当readyState改变时被触发 此时再来看示例中的这段代码是什么意思 xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } } 就是说 在readyState改变时，会触发这个方法 方法体是 如果执行成功（xmlhttp.readyState==4 && xmlhttp.status==200） 以 xmlhttp的readyState和status属性作为请求执行成功的依据 从上述可以看出，从上传到响应，到执行状态标示，所有的动作都是xmlhttp放出的，所有的信息结果都储存在xmlhttp属性中 xmlhttp是XMLHttpRequest对象的简写 XMLHttpRequest 用于在后台与服务器交换数据，所有的浏览器都支持XMLHttpRequest对象 以上就是ajax的本质内容 不管是 jquery中的jquery.ajax()或者 jquery.post() jquery.get方法都是对这些本质内容的封装（猜测） 以上所有内容可以在w3c ajax部分找到对应内容 写一篇博客只为日后忘记时能快速的看一遍 也加深一下记忆，讲一下自己的见解 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |