HTML5的你應(yīng)該記住的一些知識(shí)點(diǎn)
剛開始學(xué)HTML5是從w3school開始的,那只是非常簡(jiǎn)單的一些了解,后面開始看一些兄弟連的HTML5+CSS3的視頻,照著視頻做了一些 簡(jiǎn)單的demo(需要的童鞋可以聯(lián)系我,當(dāng)然網(wǎng)上也可以下到~~~),后面總感覺還是少了點(diǎn)什么,就開始買書看 看的是唐俊開的《HTML5移動(dòng)Web開發(fā)指南》,以下是一些簡(jiǎn)單的知識(shí)點(diǎn),只限于和我一樣的菜鳥瞄兩眼,高手勿入~~~?。?!
1 :基于HTML5的移動(dòng)Web應(yīng)用
Canvas繪圖:通過獲取HTML中的Dom元素Canvas,調(diào)用其渲染上下文的Context對(duì)象,使用Js進(jìn)行圖形繪制。
多媒體:Video和Audio (多媒體視頻格式:Ogg MPEG4 WebM)
本地存儲(chǔ):通過提供key/value方式存儲(chǔ)數(shù)據(jù)
Web Storage:
基于HTML5的移動(dòng)Web應(yīng)用
Canvas繪圖:通過獲取HTML中的Dom元素Canvas,調(diào)用其渲染上下文的Context對(duì)象,使用Js進(jìn)行圖形繪制。
多媒體:Video和Audio (多媒體視頻格式:Ogg MPEG4 WebM)
本地存儲(chǔ):通過提供key/value方式存儲(chǔ)數(shù)據(jù)
Web Storage:localStorage - 沒有時(shí)間限制的數(shù)據(jù)存儲(chǔ)
sessionStorage - 針對(duì)一個(gè) session 的數(shù)據(jù)存儲(chǔ),當(dāng)用戶關(guān)閉瀏覽器窗口后,數(shù)據(jù)會(huì)被刪除
Web SQL Database: 通過類似關(guān)系數(shù)據(jù)庫的形式存儲(chǔ)數(shù)據(jù)(已經(jīng)是個(gè)廢棄的標(biāo)準(zhǔn)了) 三個(gè)核心方法 openDatabase transaction executeSql
離線應(yīng)用:當(dāng)支持離線應(yīng)用的瀏覽器檢測(cè)到清單文件(Manifest File),中的任何資源文件時(shí),便會(huì)下載對(duì)應(yīng)的資源文件,將它們緩存到本地
使用地理位置
移動(dòng)Web框架:基于jQuery頁面驅(qū)動(dòng)的jQuery Mobile、基于ExtJS架構(gòu)的Sencha Touch,以及能打通Web和Native兩者之間通道的PhoneGap框架。有兩種開發(fā)模式:基于傳統(tǒng)Web的開發(fā)(jQuery Mobile)和基于組件式的Web開發(fā)(Sencha Touch)
localStorage - 沒有時(shí)間限制的數(shù)據(jù)存儲(chǔ)
sessionStorage - 針對(duì)一個(gè) session 的數(shù)據(jù)存儲(chǔ),當(dāng) 用戶關(guān)閉瀏覽器窗口后,數(shù)據(jù)會(huì)被刪除
Web SQL Database: 通過類似關(guān)系數(shù)據(jù)庫的形式存儲(chǔ)數(shù)據(jù)(已經(jīng)是個(gè)廢棄的標(biāo)準(zhǔn)了) 三個(gè)核心方法 openDatabase transaction executeSql
離線應(yīng)用:當(dāng)支持離線應(yīng)用的瀏覽器檢測(cè)到清單文件(Manifest File),中的任何資源文件時(shí),便會(huì)下載對(duì)應(yīng)的資源文件,將它們緩存到本地
使用地理位置
移動(dòng)Web框架:基于jQuery頁面驅(qū)動(dòng)的jQuery Mobile、基于ExtJS架構(gòu)的Sencha Touch,以及能打通Web和Native兩者之間通道的PhoneGap框架。有兩種開發(fā)模式:基于傳統(tǒng)Web的開發(fā)(jQuery Mobile)和基于組件式的Web開發(fā)(Sencha Touch)
2:HTML5 中的一些有趣的新特性:
-
用于繪畫的 canvas 元素
-
用于媒介回放的 video 和 audio 元素
-
對(duì)本地離線存儲(chǔ)的更好的支持
-
新的特殊內(nèi)容元素,比如 article、footer、header、nav、section
-
新的表單控件,比如 calendar、date、time、email、url、search
3:localStorage: ***保存的數(shù)據(jù),是域內(nèi)安全的,它是基于域的,任何在該域內(nèi)的所有頁面,都可以訪問localStorage數(shù)據(jù)。
注意的是 Firefox中使用localStorage存儲(chǔ)的數(shù)據(jù)在Chorme瀏覽器是無法讀取的,同樣,由于localStorage數(shù)據(jù)保存在設(shè)備中,同一個(gè)應(yīng)用程序在不同設(shè)備上保存的數(shù)據(jù)是不同的,比如Android的數(shù)據(jù)IOS訪問不了
先來看看Storage的API :屬性 length;方法:setItem、getItem、removeItem、clear 當(dāng)然大家看名稱也都能知道這些是什么含義,在這里就不具體贅述各自的具體寫法
sessionStorage: 存儲(chǔ)的數(shù)據(jù)周期只保存在存儲(chǔ)它的當(dāng)前窗口或者當(dāng)前窗口新建的新窗口中,一旦關(guān)閉,數(shù)據(jù)就清除,它承接于Storage的接口,用法和localStorage基本一樣
Storage時(shí)間監(jiān)聽: StorageEvent的API: key、oldValue、newValue、url、StorageArea; Storage時(shí)間可以使用addEventListener進(jìn)行注冊(cè)監(jiān)聽






