摘要:當用戶多次訪問您的網站,那么靜態資源在瀏覽器的緩存就是非常重要的。用于控制請求文件的有效時間,當請求數據在有效期內時客戶端瀏覽器從緩存請求數據而不是服務器端當緩存中數據失效或過期,才決定從服務器更新數據。
當用戶多次訪問您的網站,那么靜態資源在瀏覽器的緩存就是非常重要的。可以緩存的靜態資源包括css js 圖片等資源。
狀態碼:200:
當瀏覽器沒有緩存或者用戶按下強制刷新的時候 瀏覽器就會向服務器直接取數據 當服務器正確響應的時候會返回200
這個屬性是通用首部字段 的cache-control的屬性
這個字段給出的是一個具體的時間,在這個時間之后,這份靜態資源被認為是過時。
如Expires:Thu, 02 Apr 2009 05:14:08 GMT需和Last-Modified結合使用。
用于控制請求文件的有效時間,當請求數據在有效期內時客戶端瀏覽器從緩存請求數據而不是服務器端.當緩存中數據失效或過期,才決定從服務器更新數據。區別于Max-age:120 是一個事件段
當瀏覽器第一次向服務器請求資源并正確返回響應的時候,服務器返回的響應:
狀態碼:200
首部:Last-Modified 這個資源在服務器端最后一次被修改的時間。
實體內容:響應
當瀏覽器第二次再次訪問這個靜態資源的時候,請求報文會在首部添加字段
If-Modified-Since:值和Last-Modified(第一次接收到的響應的)值是一樣的,來詢問服務器在這個時間之后是更新過這個資源。如果沒有更新過就會返回響應:304 Not_Modified
這個字段是 請求變量的實體值
當用戶第一次訪問的時候,服務器會返回
狀態碼:200
首部字段:Etag:dadmsdadks23
實體:相應的內容
當用戶第二次請求該靜態資源的時候會發送
首部字段:if-None-Math:w/dadmsdadks23
如果這個靜態資源的實體值仍然為dadmsdadks23 就會返回304
這是html5的新特性 有兼容性問題。
使用websql有以下3步:
1、使用openDataBase創建數據庫
2、使用創建的額數據庫訪問對象來執行transation方法,通過此方法設置一個開啟事務的成功的事件響應方法。
3、通過executeSql方法來執行查詢。也可以是crud
var dataBase=openDatabase("school","1.0","表示學校的數據庫",1024*1024,function () { console.log(11) }) if(!dataBase){ console.log("當前瀏覽器不支持webSql") }else{ //創建表 /*dataBase.transaction(function (ts) {//啟動一個事務,并設置回調函數,啟動成功的時候執行 ts.executeSql("create table if not exists Student(id int,name text null,age int,sex text null)",[],function (ts,result) { console.log("創建成功一個表"+result) },function (ts,message) { console.log("這個表沒有被成功創建"+message) }) })*/ //向表中插入數據 /*dataBase.transaction(function (ts) { ts.executeSql("insert into Student(id,name,age,sex) values (?,?,?,?)",[2,"小明",21,"男"],function (ts,res) { console.log("數據插入成功"+res) },function (ts,message) { console.log("數據插入失敗"+message) }) })*/ //數據更新 /*dataBase.transaction(function (ts) { ts.executeSql("update Student set name=? where id=?",["小紅s",2],function (ts,res) { console.log("數據更新成功"+res) },function (ts,message) { console.log("數據更新失敗"+message) }) })*/ //刪除數據 /* dataBase.transaction(function (ts) { ts.executeSql("delete from Student where id=?",[2],function (ts,res) { console.log("數據刪除成功"+res) },function (ts,message) { console.log("數據刪除失敗"+message) }) })*/ dataBase.transaction(function (ts) { ts.executeSql("select * from Student",[],function (ts,res) { if(res){ for(var i=0;iWebStorage HTML新增的本地存儲化方案之一。它的存在在于解決本來不應該用cookie做,卻不得不用cookie做的事情。localStorage和sessionStorage
localStroage可以永久性的存儲數據,除非顯示的將數據刪除或清空。sessionStorage中存儲的數據只會在會話期間有效,關閉瀏覽器的時候自動刪除數據。
var ls=localStorage; //設置key和value ls.setItem("name","1"); for(var i=0;i同時HTML5中規定對WebStorage做修改的時候,會觸發storage事件。但是這個一般用于多窗口之間共享一個數據,看到這里是不是很疑惑那storage事件到底有什么用,多窗口間多通信用到它就是最好選擇了,比如某塊公用內容區域基礎數據部分都是從store中提取的,這個區域中大多數頁面中都有,當用戶打開多個頁面時,在其中一個頁面做了數據修改,那其他頁面同步更新是不是很方便(當前頁面就要用其他方式處理了),當然用于窗口間通信它作用不僅僅如此,更多的大家可以利用它特性去發揮。
頁面1window.addEventListener("storage", function(e){ console.log(e); document.write("oldValue: "+ e.oldValue+" newValue:"+ e.newValue) });頁面2