Ajax-Ajax核心代码

向右看齐 2022-07-14 00:20 190阅读 0赞

![Center][]

1, var xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");  
  在IE中实例化Msxml2.XMLHTTP对象  
  Msxml2.XMLHTTP是IE浏览器内置的对象，该对象具有异步提交数据和获取结果的功能，  
  若有其他浏览器，可使用编程框架:  
   <script type="text/javascript">  
       var xmlHttp;  
       function initAjax()\{  
if(window.XMLHttpRequest)\{       //Mozilla等浏览器  
  xmlHttp = new XMLHttpRequest();  
\}  
else if(window.ActiveXObject)   //IE浏览器  
try\{  
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");  
\}  
catch(e)\{  
   xmlHttp = new ActiveXObject(Microsoft.XNLHTTP);  
\}  
catch(e)\{  
   window.alert("浏览器不支持Ajax");  
\}  
        \}  
       </script>  
  
    2, xmlHttp.open("get","info.jsp",true);  
       指定异步提交的目标和方式，调用了xmlHttp的open方法  
       该方法一共有三个参数，参数1表示请求的方式  
                             参数2表示请求的目标，也可以写info.jsp?account=100  
                             参数3为true表示异步请求，可以通俗理解为后台提交  
      
    3，xmlHttp.onreadystatechange = function()\{  ..代码... \}  
       指定当xmlHttp状态改变时，需要进行的处理，处理一般是响应函数的形式  
       此种方式是将处理代码直接写在后面，还可以将代码单独写成函数：  
         xmlHttp.onreadystatechange = handle；  
         ...  
         function handle()\{ //处理代码 \}  
         
       在请求的过程中，xmlHttp状态不断改变，其状态保存在xmlHttp的readyState属性，  
       用xmlHttp.readyState表示，常见的readyState属性值如下：  
       0：未初始化状态，对象已经创建，尚未调用open()  
       1: 已初始化状态，调用open()方法以后。  
       2：发送数据状态，嗲用send()方法以后。  
       3：数据传送中的状态，已经接到部分数据，但接受没有完成。  
       4；完成状态，数据全部接受完成。  
         
         
    4，编写处理代码  
        if(xmlHttp.readyState == 4)\{    
infoDiv.innerHTML = xmlHttp.responseText;  
\}  
       当状态为4时，将infoDiv内部的html代码变为xmlHttp.responseText  
       其中xmlHttp.responseText表示从提交目标得到的xml格式的数据          
         
       特别说明：  
         infoDiv除了具有innerHTML属性外，还有innerText属性，表示不考虑其中的  
         HTML标签。  
         
         
     5， 发出请求，调用xmlHttp的send函数  
         xmlHttp.send();  
         如果请求的是get的话，send可以没有参数，或者参数为null；若请求的是post，  
         可以将需要传送的内容传入send函数中以字符串的形式发出。  
         即使以post方法请求，send函数依然可以将参数置空，因为可以将需要传送的内容附加在  
         url后面进行请求，如：  
          
         由于Ajax项目，目标页面是异步提交，如果目标页面发生了修改，在客户端不一定能够马上检测到  
         显示的仍是以前目标页面的内容，此情况，可用如下解决：  
          （1） 将目标页面直接输入URL进行访问，迫使服务器重新编译  
        （ 2） 将目标页面用response.setHeader("Cache-Control","no-cache");  
                    设置为不在客户端缓存驻留。

[Center]: /images/20220714/09769ce94e3f423db62a8ec171ad1e8c.png