首頁  >  文章  >  web前端  >  html5指南-6.如何建立離線web應用程式實作離線存取_html5教學技巧

html5指南-6.如何建立離線web應用程式實作離線存取_html5教學技巧

WBOY
WBOY原創
2016-05-16 15:50:211417瀏覽

今天我們的內容是關於如何創建離線web應用,他的好處是可以讓瀏覽器下載我們指定的web資源,這樣用戶在離線狀態下也能正常使用我們的網站。

1.定義Manifest

我們使用manifest列舉出需要離線時存取的資源,他本身是一個文字類型的文件,第一行經常是CACHE MANIFEST,然後列舉我們需要的資源,每行一個。檔案沒有固定的命名規則,後綴名也沒有要求,唯一的要求就是需要把後綴名在伺服器端以text/cache-manifest的MIME類型定義。

如果是iis 7伺服器,請按照下面的步驟

1.例如後綴名為.appcache,打開iis7,選擇根節點(這樣所有站點都會繼承配置,也可以針對單一站點配置);

2.雙擊右側的MIME類型;

3.點選右鍵新增MIME類型,這樣就完成了設定。

伺服器設定完畢,新增manifest檔。

複製代碼
代碼如下:
img/1.jpg
img/2.jpg
img/3.jpg


然後我們看下面的範例。


複製程式碼程式碼如下:
程式碼如下:


程式碼如下:


程式碼如下:


程式碼如下:


> HTML> html manifest="manifest.appcache">

Example



<script><🎜> var buttons = document.getElementsByTagName('button');<🎜> for (var i = 0; i < buttons.length; i ) {<🎜> buttons[i].onclick = handleButtonPress;<🎜> }<🎜> function handleButtonPress(e) {<🎜> document.getElementBy('leButtonPress(e) {<🎜> document.getElementBy). src = 'img/' e.target.id '.jpg';<🎜> }<🎜> </script>
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn