武林網(wǎng)(www.survivalescaperooms.com)文章簡(jiǎn)介:iOS 4.2版safari對(duì)HTML5特性支持更新.
文章整理自 Safari on iOS 4.2: Accelerometer, WebSockets, SVG, AJAX2 & better HTML5 support
嗯,據(jù)說(shuō)iOS 4.2發(fā)布了,所有的iPhone,iPod、iPad啥的,都可以免費(fèi)更新。令人欣慰的是,這個(gè)版本的iOS對(duì)HTML5新特性的支持有比較大的升級(jí),其中包括對(duì)WebSockets和加速器(Accelerometer)的支持,新的event、支持打印、新的JavaScript 數(shù)據(jù)類型和更好的SVG支持。
事實(shí)上,Apple還沒(méi)有更新Safari文檔。這里的信息只是基于在Safari(注:文中的Safari指iOS移動(dòng)設(shè)備中的Safari瀏覽器,不包括PC和Mac機(jī)中的Safari)自身的JavaScript研究和測(cè)試上。具體來(lái)說(shuō),檢測(cè)到的新特性如下:
加速器支持或許你已經(jīng)知道,iOS設(shè)備都有加速傳感器(還有其它的,比如磁力及和陀螺儀),但是直到現(xiàn)在,網(wǎng)頁(yè)開發(fā)者沒(méi)有操作這些傳感器的權(quán)限。Safari現(xiàn)在支持 DeviceOrientation API (W3C草案),不過(guò),雖然看起來(lái)全部的API都是被支持的(包括ondeviceorientation 和ondevicemotion事件),但是在測(cè)試中,我只能成功的使用加速器的數(shù)據(jù)。
如果你已經(jīng)有了iOS 4.2的設(shè)備,可以用Safari瀏覽器訪問(wèn) ad.ag/jtjdmj 自行測(cè)試。
要想檢測(cè)每秒鐘50次加速計(jì)數(shù)據(jù)變化,你需要在window全局對(duì)象監(jiān)聽ondevicemotion事件,然后在DeviceOrientationEvent參數(shù)上使用accelerationIncludingGravity屬性。它有三個(gè)值:x、y和z,分別代表每個(gè)坐標(biāo)上的加速度g (gravity,重力)。你可以將加速計(jì)數(shù)用于游戲,效果或者CSS動(dòng)畫中。
12345window.event
WebSockets另一個(gè)大更新是對(duì)WebSockets的支持。WebSockets是一個(gè)尚處于草案狀態(tài)的W3C HTML5 API,允許JavaScript使用一種開放的雙向、雙全工連接到一臺(tái)服務(wù)器,通過(guò)TCP sockets。這對(duì)于聊天和實(shí)時(shí)應(yīng)用來(lái)說(shuō)是一個(gè)非常好的消息,因?yàn)榭梢源蟠鬁p少AJAX周期性調(diào)用。
你將需要一臺(tái)能夠通過(guò)一種HTTP握手理解新的WebSocket協(xié)議的服務(wù)器。如果服務(wù)器不支持WebSocket或者由于代理/網(wǎng)關(guān)的原因,你將還要依賴一種fallback機(jī)制。
HTML5表單支持其實(shí)webkit對(duì)HTML5表單的支持相對(duì)已經(jīng)比較不錯(cuò),現(xiàn)在iOS 4.2的Safari開始支持 required屬性以及 :invalid CSS偽類。這樣的話,下面的代碼將展示一個(gè)文本框在輸入正確的時(shí)候顯示綠色背景,而不正確的時(shí)候顯示黃色背景。
<style>input {background-color: green;color: white;}input:invalid {background-color: yellow;}required>
AJAX2名為FormData對(duì)象,這允許我們很方便的通過(guò)Ajax發(fā)生表單數(shù)據(jù)。
打印支持iOS4.2引入了 AirPrint,一種無(wú)限打印方案。也就是說(shuō),我們現(xiàn)在可以使用 window.print 來(lái)在Safari中調(diào)用打印對(duì)話框了。
新的JavaScript 數(shù)據(jù)類型Safari現(xiàn)在支持 二進(jìn)制類 (Blob Class)和許多整數(shù)類型的集合,比如 Float32Array,Int8Array,Uint8Array,Int16Array Unit16Array,Int32Array以及Uint32Array等在Typed Arrays規(guī)范中定義的數(shù)組。更多信息可訪問(wèn) 。
新DOM事件在新的動(dòng)作類事件中,我們現(xiàn)在可以使用HTML 5新的 onhashchange事件用于檢測(cè)AJAX類webapp中URL中散列(#)之后的變化,以及HTML5草案規(guī)范中的invalid、onbeforeload 以及onpopstate事件。
現(xiàn)在,我們也可以使用window.captureEvents和window.releaseEvents來(lái)監(jiān)聽全局方法中的事件。
SVG和Canvas支持增強(qiáng)iOS支持作為獨(dú)立文件的SVG以及內(nèi)聯(lián)SVG(使用svg標(biāo)簽)?,F(xiàn)在我們可以直接在我們的文檔中創(chuàng)建SVG文檔——使用超過(guò)20個(gè)SVG___類,比如SVGDocument,SVGImage等…
對(duì)于Canvas,現(xiàn)在支持imageData data-type,一種從JavaScript以像素級(jí)操作圖片的方法。
其它東東PS:由于我本人并沒(méi)有iPhone、iPad啥的,所以沒(méi)有辦法對(duì)文中的內(nèi)容進(jìn)行逐個(gè)測(cè)試,如果你發(fā)現(xiàn)了某些錯(cuò)誤或者新的內(nèi)容,請(qǐng)通過(guò)留言提交,我會(huì)及時(shí)更新本文,多謝——神飛
新聞熱點(diǎn)
疑難解答