js中的Ajax總結

js中的Ajax總結.
一.ajax的做用:
1.就是讓js去讀服務器上面的數據.
2.無刷新的狀況下讀取服務器上面的數據,例如:驗證帳號和密碼是否正確等.
(1)ajax的優勢:
1.減小冗餘請求和響應對服務形成的負擔.
2.無刷新更新頁面,帶來更好的用戶體驗.
3.減輕服務器速寫的負擔,節約空間和寬帶租用成本。
4.採用異步提交,讀寫速度更快.
(2)ajax的缺點:
1.AJAX大量的使用了javascript和ajax引擎,這些取決於瀏覽器的支持.在編寫的時候考慮對瀏覽器的兼容性javascript

  1. AJAX只是局部刷新,因此頁面的後退按鈕是沒有用的.
  2. 對流媒體還有移動設備的支持不是太好等.
    二. Get 和Post的區別:
    get方式:常見的表單提交方式:將值在url後面提交;?名字=值&名字=值格.
    提交表單例子:
    <form action="www.baidu.com " method="get" (默認是get方式)>
    姓名:<input type="text" name="userName"></br>
    密碼:<input type="password" name="password">
    <input type="submit" value="提交">
    </from>java

    區別: ajax

    1.get方式是經過網址進行傳遞數據的,post是經過http中Content進行傳遞的.
    2.get容量小,不適合傳遞大數據,(通常4k-10k),post方式容量相對大不少,通常服務器能夠達到2G容量.
    3.對於太大的文件,就不會走post,走控件.
    4.get方式安全性差,post相對來講會好一點,一幫安全只能走https.
    5.get方式是有緩存的,post沒有緩存. get更適合向服務器獲取數據,post更適合向服務器傳遞數據,瀏覽器

三:編寫一個Ajax:
1.建立一個ajax對象,
2.連接到服務器,
3.發送請求 ,
4.接收返回值,緩存

(1) 建立一個ajax對象
var oAjax = new XMLHttpRequest()//不支持IE6
var oAjax = new ActiveXObject ("microsoft.XMLHTTP");//支持IE6安全

解決兼容性:
        if(window.XMLHttpRequest)
         {
         var  oAjax   = new XMLHttpRequest();
         }
         else
         {
          var  oAjax   = new  ActivexObject("Microsoft.XMLHTTP")
         }

     爲何要用window.XMLHttpRequest做爲參數,應爲直接XMLHttpRequest作條件,IE6會直接報錯,

     可是把XMLHttpRequest做爲屬性,IE只會報undefined恰好知足咱們的條件.

 (2)連接服務器
  oAjax.open('Get',url,true)
  同步:一步步來.
  異步:多件事一塊兒來.
(3)發送請求
  oAjax.send();
(4)接受返回
   oAjax.onreadystatechange = function()
  { 
       //瀏覽器和服務器進行到哪一步了.
       if(oAjax.readyState==4)//讀取完成
        { 

             if(oAjax.status==200)//讀取成功
             {
                   fnSuccess(oAjax.responseText)

             }else if( fnfaild)
                  {
                     fnfaild(oAjax.status);

                   }
             }
         } 
  }

readystatus 描述
0 (未初始化)尚未調用open()方法
1 (載入)一調用send()方法,怎在發送請求
2 (載入完成)send()方法完成,已收到所有響應內容
3 (解析)正在解析響應內容
4 (完成)響應內容解析完成,能夠客戶調用了
同步請求:發生請求後,要等待服務器執行完畢才繼續執行當前代碼。服務器

異步請求:發生請求後,無需等到服務器執行完畢,能夠繼續執行當前代碼。
相關文章
相關標籤/搜索