0.前言
在專案推進過程中經常使用ajax,通過jquery提供的函式可以非常方便的使用ajax,但是在實際使用中也遇到一些問題,例如如何防止瀏覽器使用快取,如何使用同步方式等。通過博文整理總結希望自身有所提高。
在這裡通過乙個加法例子說明問題.為了突出ajax,前端網頁和後端php程式盡可能的簡單。
【前端】——add.html
圖1 add頁面
【後端】——add.php
<?php
// 返回json格式
$result = array();
$result["result"] = $_get["a"] + $_get["b"];
echo json_encode($result, json_numeric_check);
?>
【**倉庫】——
test-jquery-ajax
**倉庫位於bitbucket使用hg(而不是git),hg在windows或ubuntu上均有很好用的gui工具——tortoisehg,本人愚笨沒能熟練掌握git。
【 tortoisehg使用說明】——如果沒有使用過hg請參考博文hg clone部分操作即可。 【
jquery 中文api】
1.常用的getjson
var submit_async = function() ,
function(data) );
};
【http請求和響應】
圖2 完整的http請求和響應
2.防止瀏覽器使用快取
瀏覽器為了加快執行速度,如果反覆請求同乙個url,那麼瀏覽器會使用快取中的內容而不在向伺服器重新請求。為了防止瀏覽器使用快取,可以在url之後加入一些變化的內容,最常用的方法便是加入當前時間的毫秒值,例如加入&now=《當前時間毫秒值》。(即使用這種方法也存在一些「頑固派」,例如執行ios6系統的safari瀏覽器)。
var submit_async = function() ,
function(data) );
};
【http請求和響應】
圖3 完整的http請求和響應
3.使用同步方式
getjson方法並沒有同步選項,如果使用同步方式可使用ajax原生方法。同步方式需要設定async選項為false。
var submit_sync = function() ,
datatype: "json",
// cache: false,
success: function(data) // 注意不要在此行增加逗號
});}
【http請求和響應】
http請求和響應同圖3.
4.再議防止瀏覽器使用快取
在ajax方法中有乙個
cache選項,如果設定為cache:false意為禁止瀏覽器快取。實現的方法和非常相似,該引數在url之後加入&_=《當前時間毫秒值》
var submit_sync = function() ,
datatype: "json",
cache: false,
success: function(data) // 注意不要在此行增加逗號
});}
【http請求和響應】
圖4 完整的http請求和響應
前端學習 JQuery Ajax使用經驗
0.前言 在專案推進過程中常常使用ajax,通過jquery提供的函式能夠很方便的使用ajax,可是在實際使用中也遇到一些問題,比如怎樣防止瀏覽器使用快取,怎樣使用同步方式等。通過博文整理總結希望自身有所提高。在這裡通過乙個加法樣例說明問題.為了突出ajax,前端網頁和後端php程式盡可能的簡單。前...
前端基礎學習 資料請求之axios的基本使用
axios 是專注於網路資料請求的庫。相比於原生的 xmlhttprequest 物件,axios 簡單易用。相比於 jquery,axios 更加輕量化,只專注於網路資料請求。axios.get 位址 then 成功時的處理函式 axios.get then function res axios....
網頁前端效能測試 Lighthouse的使用
lighthouse 幫助 是乙個google開源的自動化工具,它的主要功能就是檢測 的效能,分析網路應用和網頁,收集現代效能指標並提供對開發人員最佳實踐的意見。它能夠針對性能 可訪問性 漸進式 web 應用等進行審核。由於chrome開發著工具中audits面板配置好引數,點選 run audit...