javascript原生態的同步異步請求實現

 1 <script>
 2     //同步請求
 3     function sync_test(){
 4         //實例化XmlHttpRequest對象
 5         var xhr=new XMLHttpRequest();
 6         //使用GET方式請求指定網址的頁面
 7         xhr.open("GET","http://www.baidu.com",false);
 8         //發送空內容請求
 9         xhr.send(null);
10 
11         if(xhr.status===200){//200狀態碼錶示正常
12             alert(xhr.responseText);
13         }else{
14             alert("Error occurred:"+xhr.statusText);
15         }    
16     }
17 
18     //異步請求
19     function async_test(){
20         //實例化XmlHttpRequest對象
21         var xhr=new XMLHttpRequest();
22         //使用GET方式請求指定網址的頁面
23         xhr.open("GET","http://www.baidu.com",true);
24         //添加回調函數
25         xhr.onreadystatechange=function(){
26             if(xhr.readyState===4){//4意味着處理完成
27                 if(xhr.status===200){
28                     alert(xhr.responseText);
29                 }else{
30                     alert("Error occurred:"+xhr.statusText);
31                 }
32             }
33         };
34         //發送空內容請求
35         xhr.send(null);    //注意:回調函數必須在xhr.send(null)以前調用,不然沒法調用    
36     }
37   </script>

 

 1 //jQuery實現同步異步請求:
 2     $.ajax("baidu.com").done(function(data){//done()等價於舊版的success()
 3         alert(data);
 4     }).fail(function(xhr){//fail()等價於舊版的error()
 5         alert("Error occurred:"+xhr.statusText);
 6     });
 7     //jQuery默認就是Get和異步請求方式,若是要更改這些,則如下這種寫法:
 8     $.ajax({
 9         url:"baidu.com",
10         async:false,//表示同步請求
11         type:"GET",//Get或者Post,默認Get方式
12         done:function(data){
13             alert(data);
14         }
15         fail:function(xhr){
16             alert(""+xhr.statusText);
17         }
18     });
相關文章
相關標籤/搜索