WEB新技術(shù)：HTML5介紹.pptx

,簡(jiǎn)化的聲明,HTML5, Title of the document The content of the document ,HTML4有三種聲明：Strict、Transitional 以及 Frameset, ,更加語(yǔ)義化的結(jié)構(gòu),新增的主體結(jié)構(gòu)元素 article - 獨(dú)立的內(nèi)容 section -文檔中的節(jié)。是段落 nav - 導(dǎo)航鏈接的部分 aside - 其所處內(nèi)容之外的內(nèi)容。可用作側(cè)欄 time 表面日期或時(shí)間 pubdate屬性 -指示 元素中的日期/時(shí)間是文檔的發(fā)布日期 新增的非主體結(jié)構(gòu)元素 header - 文檔的頁(yè)眉（介紹信息） hgroup -對(duì)網(wǎng)頁(yè)或區(qū)段（section）的標(biāo)題進(jìn)行組合 footer -文檔的頁(yè)腳 address - 文檔作者或擁有者的聯(lián)系信息,更加語(yǔ)義化的結(jié)構(gòu),HTML4,HTML5,更加語(yǔ)義化的結(jié)構(gòu), 網(wǎng)頁(yè)的標(biāo)題 頁(yè)頭 文章一級(jí)標(biāo)題 文章二級(jí)標(biāo)題 文章內(nèi)容 ,Form 2.0,新表單,表單元素,datalist - 規(guī)定輸入域的選項(xiàng)列表 keygen - 提供一種驗(yàn)證用戶的可靠方法 output - 用于不同類型的輸出，比如計(jì)算或腳本輸出,新的 form 屬性,autocomplete 自動(dòng)完成 novalidate 無需驗(yàn)證,新input type,email url number range Date pickers (date, month, week, time, datetime, datetime-local) search color tel,新的 input 屬性,autocomplete 自動(dòng)完成 autofocus 自動(dòng)獲得焦點(diǎn) form 加入到某form中 form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget) 重寫表單屬性 height 和 width list 關(guān)聯(lián)datalist來限定輸入值 min, max 和 step 用在中 multiple - 規(guī)定輸入域中可選擇多個(gè)值 pattern (regexp) - 用于驗(yàn)證 input 域的模式（pattern） placeholder - 提示（hint），描述輸入域所期待的值 required - 規(guī)定必須在提交之前填寫輸入域（不能為空）,文件API,FileList: Blob File FileReader URI scheme,html5的拖拽API,被拖拽元素上的事件：dragstart、 dragend 目標(biāo)元素上的事件：dragenter、 dragover、 dragleave、 drop 元素屬性 draggable=“true” event.dataTransfer對(duì)象,畫圖,畫圖形 畫圖片 設(shè)置風(fēng)格和顏色 變形 組合 動(dòng)畫 WebGL,和,多媒體元素,屬性,src：視頻的URL poster：視頻封面，沒有播放時(shí)顯示的圖片 preload：預(yù)加載 autoplay：自動(dòng)播放 loop：循環(huán)播放 controls：瀏覽器自帶的控制條 width：視頻寬度 height：視頻高度,屬性,src：音樂的URL preload：預(yù)加載 autoplay：自動(dòng)播放 loop：循環(huán)播放 controls：瀏覽器自帶的控制條,本地存儲(chǔ),DOM Storage sessionStorage localStorage Web SQL Database,離線應(yīng)用程序,Server 端設(shè)置 AddType text/cache-manifest appcache cache manifest文件 更新緩存 自動(dòng)更新 手動(dòng)更新: window.applicationCache.update(),WebSocket,new WebSocket(ws:/domain/path); send(msg) onmessage, onerror, onopen, onclose Server：jetty7/8, jWebsocket,web workers后臺(tái)線程,可以做什么： 可以加載一個(gè)JS進(jìn)行大量的復(fù)雜計(jì)算而不掛起主進(jìn)程，并通過postMessage，onmessage進(jìn)行通信 可以在worker中通過importScripts(url)加載另外的腳本文件 可以使用 setTimeout(), clearTimeout(), setInterval(), and clearInterval() 可以使用XMLHttpRequest來發(fā)送請(qǐng)求 可以訪問navigator的部分屬性 有那些局限性： 不能跨域加載JS worker內(nèi)代碼不能訪問DOM 各個(gè)瀏覽器對(duì)Worker的實(shí)現(xiàn)不大一致，例如FF里允許worker中創(chuàng)建新的worker,而Chrome中就不行 不是每個(gè)瀏覽器都支持這個(gè)新特性 目前效率很低,地理位置信息,navigator.geolocation latitude: 緯度 longitude: 精度 accuracy: 精確度，單位米 altitude: 高度，單位米 altitudeAccuracy: 高度的精確地，單位米 heading運(yùn)動(dòng)的