h5離線存儲

① h5和css3有哪些新特性

H5的新特性：

1. 用於繪畫 canvas 元素。

2. 用於媒介回放的 video 和 audio 元素。

3. 本地離線存儲 localStorage 長期存儲數據，瀏覽器關閉後數據不丟失；sessionStorage 的數據在瀏覽器關閉後自動刪除。

4. 語意化更好的內容元素，比如 article、footer、header、nav、section。

5. 表單控制項，calendar、date、time、email、url、search。

② h5特點及新特性

H5的特點是有了很多新的標簽，比較實用，寫起來方便

③ h5怎麼保存到手機,不用網也能打開

1、首先在手機應用中，點擊打開【MAKA】圖標，如下圖所示。

④ 什麼是H5技術

HTML5並不是一項技術，而是一個標准。」H5「本應是一個技術合集，卻被意會成了一項技術。

HTML，全程為HyperTextMarkupLanguage,中文直意為「超級文本標記語言"從94年由萬維網(W3C)發明至今，已逐漸成為了網頁標記語言的行業規范，它是構成網頁的一種標記編寫語言，html目前也歷經了5次小大修改，也可以說H5是html的第5代語言。

技術要點：

1、重要標記

<video>標記

定義和用法

</video> 標簽定義視頻，比如電影片段或其他視頻流。

<audio> 標記。

定義和用法

</audio> 標簽定義聲音，比如音樂或其他音頻流。

2、程序介面

除了原先的DOM介面，HTML5增加了更多API,如：

（1）、用於即時2D繪圖的Canvas標簽；

（2）、 定時媒體回放；

（3）、 離線資料庫存儲；

（4）、文檔編輯；

（5）、 拖拽控制；

（6）、瀏覽歷史管理。

3、元素變化

新的解析順序新的元素：section, video, progress, nav, meter, time, aside, canvasinput。

元素的新屬性：日期和時間，email, url。

新的通用屬性：ping, charset, async。

全域屬性：id, tabindex, repeat。

移除元素：center, font, strike。

4、控制項

就是Html標注的屬性里加上runat="server"所構成的控制項，至於Html標注和Html控制項之間的區別很明顯，Html控制項是運行於伺服器端，Html標注是運行於客戶端。

基本Html控制項有：

。

自定義的Html控制項是根據自己的需求定義。當自主開發效率低，可以從技術社區、源碼網站下載需要的控制項。比如，需要插入table, image, links 等標簽。不必自己開發，可以使用ComponentOne Wijmo Editor等。

5、圖表庫

.Net圖表控制項Chart FX相信大家已經非常熟悉了。Chart FX的開發商SoftwareFX推出的一套為HTML5、jQuery和JavaScript開發者設計的免費HTML5圖表庫——jChartFX！

jChartFX亮點：

（1）、jChartFX充分利用了HTML5，CSS和SVG，讓您能夠在瀏覽器提供美觀優越的圖表和更豐富的最終用戶體驗。

（2）、jChartFX擁有很多令人振奮的功能，它在無插件純JavaScript的瀏覽器上運行，這意味著在提高了網站安全性和速度的同時，最大程度的減少了網站伺服器的負荷。

（4）、jChartFX還能夠自動整合到jQuery UI ThemeRoller，自動讀取並解釋jQuery的主題和CSS文件，能夠快速適應您的頁面布局和設計，無需一行代碼。

（4）、jChartFX支持JSON，JSON能夠幫助您實現，任何數據源中的數據都可以展現到圖表中。

（5）、jChartFX還支持超過40種的2D、3D圖表類型，免費的圖表控制項中支持如此之多的圖表展示類型實屬難得。

(4)h5離線存儲擴展閱讀：

HTML5賦予網頁更好的意義和結構。更加豐富的標簽將隨著對RDFa的，微數據與微格式等方面的支持，構建對程序、對用戶都更有價值的數據驅動的Web。

1、本地存儲特性（Class: OFFLINE & STORAGE）

基於HTML5開發的網頁APP擁有更短的啟動時間，更快的聯網速度，這些全得益於HTML5 APP Cache，以及本地存儲功能。Indexed DB（html5本地存儲最重要的技術之一）和API說明文檔。

2、設備兼容特性 (Class: DEVICE ACCESS)

從Geolocation功能的API文檔公開以來，HTML5為網頁應用開發者們提供了更多功能上的優化選擇，帶來了更多體驗功能的優勢。

HTML5提供了前所未有的數據與應用接入開放介面。使外部應用可以直接與瀏覽器內部的數據直接相連，例如視頻影音可直接與microphones及攝像頭相聯。

3、連接特性（Class: CONNECTIVITY）

更有效的連接工作效率，使得基於頁面的實時聊天，更快速的網頁游戲體驗，更優化的在線交流得到了實現。

HTML5擁有更有效的伺服器推送技術，Server-Sent Event和WebSockets就是其中的兩個特性，這兩個特性能夠幫助我們實現伺服器將數據「推送」到客戶端的功能。

4、網頁多媒體特性(Class: MULTIMEDIA)

支持網頁端的Audio、Video等多媒體功能，與網站自帶的APPS，攝像頭，影音功能相得益彰。

5、三維、圖形及特效特性（Class: 3D, Graphics & Effects）

基於SVG、Canvas、WebGL及CSS3的3D功能，用戶會驚嘆於在瀏覽器中，所呈現的驚人視覺效果。

6、性能與集成特性（Class: Performance & Integration）

沒有用戶會永遠等待Loading——HTML5會通過XMLHttpRequest2等技術，解決以前的跨域等問題，幫助您的Web應用和網站在多樣化的環境中更快速的工作。

7、CSS3特性(Class: CSS3)

在不犧牲性能和語義結構的前提下，CSS3中提供了更多的風格和更強的效果。此外，較之以前的Web排版，Web的開放字體格式（WOFF）也提供了更高的靈活性和控制性。

參考資料來源：中國經濟網-傳3·15曝光惡意App H5技術或成解決方案

參考資料來源：中國新聞網-H5發展勢頭不減：得朋友圈者得天下

⑤ HTML5離線存儲有優勢嗎

我給你舉例說下離線存儲的作用。比如用HTML5做一個手機應用，用戶使用的時候如果網路狀況不佳，連接不上伺服器，在沒使用離線存儲的情況下，應用是否就開天窗了？這樣對於用戶體驗來講肯定不舒服，我們至少得告訴用戶連接失敗的信息。
但是既然都沒連接上，又如何把沒連接上的信息告訴用戶？
這個時候我們就用離線存儲技術，將上次成功訪問的數據保存下來，並且裡麵包含了下次調用這些存儲數據時自動判斷是否連接成功，如果不成功則顯示失敗的消息。
既然現在已經能顯示失敗的信息了，那為什麼不幹脆再多點有用的信息，這樣就能讓應用在離線狀態下也能展現豐富的內容。
那既然都到這步了，我們為啥不可以把用戶在離線狀態下的某些操作(肯定是失敗的)過程記錄下來，等下次連接成功後實現操作的目的。
例如QQ空間，微博，微信，糗事網路，還有網路知道的客戶端都是利用這樣的離線存儲，當然不一定是html5的，不過原理一樣。離線狀態下，你也能看到內容，只是不能更新內容，不過能將你更新內容的操作記錄下來，待下次連接上了就能馬上更新。

手機純手打，給過吧？

⑥ 求教。H5怎麼另存到桌面

可以離線保存，只不過不能用秀堂，而需要用意派才行。你可以先用意派H5編輯器製作好一個H5，然後將它導出成一個html壓縮包，這樣就可以離線播放或部署到本地伺服器上了。需要注意的是，如果你的H5里用了評論、表單等這些功能，也是不支持導出的哦。

⑦ html5離線存儲有幾種方式

h5之前，存儲主要是用cookies。cookies缺點有在請求頭上帶著數據，大小是4k之內。主Domain污染。

目標
解決4k的大小問題
解決請求頭常帶存儲信息的問題
解決關系型存儲的問題
跨瀏覽器

1.本地存儲localstorage
存儲方式：
以鍵值對(Key-Value)的方式存儲，永久存儲，永不失效，除非手動刪除。

大小：
每個域名5M

⑧ html5 如何更新離線緩存

需要伺服器。這里用tomcat伺服器來講解。
首先要先把.manifest後綴的文件 的mine類型配置為text/cache-manifest。
一講到tomcat配置，熟悉的朋友自然就會想到web.xml這個文件，沒錯，在文件中加入如下配置就行：
1 <mime-mapping>
2 <extension>manifest</extension>
3 <mime-type>text/cache-manifest</mime-type>
4 </mime-mapping>
然後寫一個xxx.manifest文件，xxx是你自己取的一個名字。這個文件的格式是這樣的：
CACHE MANIFEST

#version 1.5

CACHE:
MyTest.html
CSS/main.css
Javascript/bwH5LS.js
exp-calif-logo.gif
第一行是必須的，它標識這是manifest的配置文件。
#version 1.5
這句是注釋，沒實際的作用，我在這里只是想讓瀏覽器更新緩存文件。因為當這個manifest文件與原來一樣的時候，瀏覽器是不會去重新載入緩存文件的，所以我們可以通過這個注釋，一方面修改版本號，另一方面讓瀏覽器更新緩存。
CACHE:
這行指示出下面的文件是要緩存的。示例中，緩存了當前頁面：MyTest.html，以及一些css和js文件 還有圖片。
還有幾個關鍵字示例中沒提到，就是
NETWORK:
FALLBACK:
NETWORK 指不想緩存的頁面；FALLBACK 是指請求的文件 沒有找到或該文件的伺服器沒有響應時的替代方案，比如我們想請求某個嵌套頁面，但這個頁面的伺服器連接不上了，那麼我可以轉向另外一個指定的頁面。
這是第二步，第三步，只要在<html>標簽中加上manifest的位置就行了：
<html manifest="NAME.manifest">
到這里，就可以實現簡單的離線應用了。
那些緩存的文件放在哪呢？
在chrome上測試，發現它是按自己的機制來分塊保存這些文件的，所以我沒找不到完整的文件。保存的數據在：
C:\Users\jasonling\AppData\Local\Google\Chrome\User Data\Default 裡面，具體怎麼存，筆者還不了解。
火狐上的文件也是按它自己的機制來存的，不過筆者本人用sqlite打開後，找到了緩存文件的具體信息：