iOS 4.2版safari对HTML5特性支持更新
2010-12-08 14:14
656 查看
文章整理自 Safari on iOS 4.2: Accelerometer, WebSockets, SVG, AJAX2 & better HTML5 support
请尊重版权,转载请注明出自前端观察 嗯,据说iOS 4.2发布了,所有的iPhone,iPod、iPad啥的,都可以免费更新。令人欣慰的是,这个版本的iOS对HTML5新特性的支持有比较大的升级, 其中包括对WebSockets和加速器(Accelerometer)的支持,新的event、支持打印、新的JavaScript 数据类型和更好的SVG支持。
事实上,Apple还没有更新Safari文档。这里的信息只是基于在Safari(注:文中的Safari指iOS移动设备中的Safari浏览器,不包括PC和Mac机中的Safari)自身的JavaScript研究和测试上。具体来说,检测到的新特性如下:
通过DeviceOrientation API支持加速器
HTML5 WebSocket API
HTML5 表单支持增强
打印支持
新的JavaScript 数据类型
新DOM事件
增强对SVG和Canvas的支持
如果你已经有了iOS 4.2的设备,可以用Safari浏览器访问 ad.ag/jtjdmj 自行测试。
要想检测每秒钟50次加速计数据变化,你需要在window全局对象监听ondevicemotion事件,然后在 DeviceOrientationEvent参数上使用accelerationIncludingGravity属性。它有三个值:x、y和z,分别 代表每个坐标上的加速度g (gravity,重力)。你可以将加速计数用于游戏,效果或者CSS动画中。
你将需要一台能够通过一种HTTP握手理解新的WebSocket协议的服务器。如果服务器不支持WebSocket或者由于代理/网关的原因,你将还要依赖一种fallback机制。
iOS4.2引入了 AirPrint,一种无限打印方案。也就是说,我们现在可以使用 window.print 来在Safari中调用打印对话框了。
现在,我们也可以使用window.captureEvents和window.releaseEvents来监听全局方法中的事件。
对于Canvas,现在支持[url=http://nooshu.com/using-image-data-inside-the-html5-canvas-element/]imageData data-type,一种从JavaScript以像素级操作图片的方法。
一种WebGLRenderingContext类可用,3D Drawing API(也就是WebGL)的一部分。
一个全局RGBColor构造函数
来自:前端观察
请尊重版权,转载请注明出自前端观察 嗯,据说iOS 4.2发布了,所有的iPhone,iPod、iPad啥的,都可以免费更新。令人欣慰的是,这个版本的iOS对HTML5新特性的支持有比较大的升级, 其中包括对WebSockets和加速器(Accelerometer)的支持,新的event、支持打印、新的JavaScript 数据类型和更好的SVG支持。
事实上,Apple还没有更新Safari文档。这里的信息只是基于在Safari(注:文中的Safari指iOS移动设备中的Safari浏览器,不包括PC和Mac机中的Safari)自身的JavaScript研究和测试上。具体来说,检测到的新特性如下:
通过DeviceOrientation API支持加速器
HTML5 WebSocket API
HTML5 表单支持增强
打印支持
新的JavaScript 数据类型
新DOM事件
增强对SVG和Canvas的支持
加速器支持
或许你已经知道,iOS设备都有加速传感器(还有其它的,比如磁力及和陀螺仪),但是直到现在,网页开发者没有操作这些传感器的权限。Safari现在支持 DeviceOrientation API (W3C草案),不过,虽然看起来全部的API都是被支持的(包括ondeviceorientation 和ondevicemotion事件),但是在测试中,我只能成功的使用加速器的数据。如果你已经有了iOS 4.2的设备,可以用Safari浏览器访问 ad.ag/jtjdmj 自行测试。
要想检测每秒钟50次加速计数据变化,你需要在window全局对象监听ondevicemotion事件,然后在 DeviceOrientationEvent参数上使用accelerationIncludingGravity属性。它有三个值:x、y和z,分别 代表每个坐标上的加速度g (gravity,重力)。你可以将加速计数用于游戏,效果或者CSS动画中。
1 2 3 4 5 | window.ondevicemotion = function(event) { // event.accelerationIncludingGravity.x // event.accelerationIncludingGravity.y // event.accelerationIncludingGravity.z } |
WebSockets
另一个大更新是对WebSockets的支持。WebSockets是一个尚处于草案状态的W3C HTML5 API,允许JavaScript使用一种开放的双向、双全工连接到一台服务器,通过TCP sockets。这对于聊天和实时应用来说是一个非常好的消息,因为可以大大减少AJAX周期性调用。你将需要一台能够通过一种HTTP握手理解新的WebSocket协议的服务器。如果服务器不支持WebSocket或者由于代理/网关的原因,你将还要依赖一种fallback机制。
HTML5表单支持
其实webkit对HTML5表单的支持相对已经比较不错,现在iOS 4.2的Safari开始支持 required属性以及 :invalid CSS伪类。这样的话,下面的代码将展示一个文本框在输入正确的时候显示绿色背景,而不正确的时候显示黄色背景。<style> input { background-color: green; color: white; } input:invalid { background-color: yellow; } </style> <input type="text" required>
AJAX2
名为打印支持[/title3]iOS4.2引入了 AirPrint,一种无限打印方案。也就是说,我们现在可以使用 window.print 来在Safari中调用打印对话框了。
新的JavaScript 数据类型
Safari现在支持 二进制类 (Blob Class)和许多整数类型的集合,比如 Float32Array,Int8Array,Uint8Array,Int16Array Unit16Array,Int32Array以及Uint32Array等在在新的动作类事件中,我们现在可以使用HTML 5新的 onhashchange事件用于检测AJAX类webapp中URL中散列(#)之后的变化,以及HTML5草案规范中的invalid、onbeforeload 以及onpopstate事件。现在,我们也可以使用window.captureEvents和window.releaseEvents来监听全局方法中的事件。
SVG和Canvas支持增强
iOS支持作为独立文件的SVG以及内联SVG(使用svg标签)。现在我们可以直接在我们的文档中创建SVG文档——使用超过20个SVG___类,比如SVGDocument,SVGImage等…对于Canvas,现在支持[url=http://nooshu.com/using-image-data-inside-the-html5-canvas-element/]imageData data-type,一种从JavaScript以像素级操作图片的方法。
其它东东
支持window全局对象的一个styleMedia属性一种WebGLRenderingContext类可用,3D Drawing API(也就是WebGL)的一部分。
一个全局RGBColor构造函数
来自:前端观察
相关文章推荐
- ios单独的页面支持横竖屏的状态调整,HTML5加载下(更新2)
- (0009) iOS 开发之友盟统计分析SDK已全面支持HTTPS的更新
- HTML5视频方案:支持Ipad Safari、Firefox、Chrome、IE9876
- html5播放视频且动态截图实现步骤与代码(支持safari其他未测试)
- 写了个html5播放视频的video控件,只支持mp4和3gp(android和ios默认支持的格式就写了这个)
- HTML5特性支持列表
- iOS开发之Xcode 6更新默认不支持armv7s架构
- Vitamio不支持特性列表(本文会持续更新 2013
- HTML5 Audio 在 iOS Safari 浏览器上的问题
- 【转】让Xcode支持iOS12.0 设备真机测试(不断更新真机支持包)Xcode 真机测试 iOS
- 关于html5支持与否的判断(JS检测是否支持HTML5新特性)
- 苹果要求所有新app以及版本更新必须支持iOS 8 SDK和64-bit
- 《JavaFX应用程序添加HTML内容》-支持HTML5特性
- 让Xcode8.0支持iOS10.3设备真机测试(不断更新真机支持包)
- 【每日新闻】iOS版Office软件获重磅更新:支持拖放功能 | CNNIC分析师:人工智能持续为搜索引擎注入发展动能
- 处理不支持HTML5/CSS3特性的旧版本浏览器问题(Modernizr 的用法)
- 只有 IE Chrome Safari 支持 'zoom' 特性并且他们的具体实现方式不同
- iOS程序更新后新特性介绍界面的实现
- 为不支持HTML5 placeholder特性的浏览器添加placeholder特性