javascript之ajax初探

ajax的无刷新功能非常强大，今天学习了一下ajax，一下是学习的笔记

重点：ajax必须是在本地服务器中运行，或者站点中运行，否则直接运行该文件是无效的！

1.将文件read.html放置在wamp的一个站点中

<!doctype html>
<html>
 <head>
     <meta charset="utf-8"/>
     </head>
     <body>
 
         <button type="button"  onclick="show()">请求数据</button>
        <script src="ajax.js"></script>
        <script>
          function show(){

            Ajax('read.txt?datetime=new Date.getTime',function(str){alert(str);},function(){alert('失败了');})
            //read.txt?datetime=new Date.getTime该方法可以组长缓存
           //函数中需要传递3个参数（文件的路径，接受成功返回的值，获取失败放回的值）
          };
        </script>
 
     </body>

</html>

所载入的ajax.js文件

 1  function Ajax(url,fnSucc,fnFaild)
 2             {
 3                  //1.创建ajax对象
 4                if(window.XMLHttpRequest)
 5                 {// code for IE7+, Firefox, Chrome, Opera, Safari
 6                      var oAjax=new XMLHttpRequest();
 7                 }
 8                else
 9                 {// code for IE6, IE5
10                     var oAjax=new ActiveXObject("Microsoft.XMLHTTP");
11                 }
12                 //2.链接服务器（打开服务器的连接）
13                 //open(方法，文件名，异步传输)
14                 oAjax.open('GET',url,true);
15                 //3.发送
16                 oAjax.send();
17                 //4.接收返回
18                 oAjax.onreadystatechange=function()
19                    {
20                      if (oAjax.readyState==4)
21                      {
22                        if(oAjax.status==200)
23                          { 
24                            fnSucc(oAjax.responseText);  
25                          }
26                       else
27                          {
28                           fnFaild(oAjax.status);
29                          }
30                         
31                      };
32                    
33                 };
34            
35              }

if you don't try,you will never know!