|
美国时间9月19日，中国时间9月20日，我更新到了ios6，第一时间没有去调戏会普通话的Siri，而是着手研究和校验ios6和它的safari都为webapp开发者或者前端开发者带来了哪些便利和好处，请注意本文的发表时间，本文是第一时间放出人肉体验测试的结果哦！
1.通过mac调试ios上的safari
ios6的到来，使ios版safari没有开发人员调试工具的状况成为了历史。
当习惯新的调试方法后，你可以放弃用chrome模拟或Weinre来调试了。
简单说来，ios6允许你通过pc或者mac上的safari的开发人员工具来调试ios设备上的safari网页
下面说一下步骤：
1>更新你的ios设备到ios6
2>打开ios设备的，点击主屏幕上的“设置”，然后“Safari”，然后滚屏到最下面， 进入“高级”，打开“web检查器”（设置->Safari->高级），如下图所示：
3>打开ios设备上的Safari，输入需要调试的页面地址并载入页面
4>用usb线将ios设备链接到电脑，打开mac上更新好的Safari
5>在mac上的Safari中选择“开发”，然后选到自己的ios设备，在右边滑出菜单中选择需要调试的网页，如下图所示：
6>点击鼠标，即可打开开发人员工具，调试ios设备上的网页，如下图所示：
如果以上操作没有奏效，请更新你mac os上的safari，或者多尝试插拔几次usb线
2.UI细节变化
通过肉眼对比，发现了这样一些细节变化，有一些是开发人员需要注意的，有一些则无关紧要
1>顶部栏变成了黑色底色
2>横屏时有了一个全屏按钮，可以全屏看网页
3>地址栏的搜索内搜索提供商的字样被换成了“搜索”2个字
4>底部的选项按钮（见图），有了更多的选项
如下图所示：
4中的更多选如下图所示：
3.新支持的css滤镜特性
ios6的Safari终于支持css3滤镜了，下面的代码在ios设备上终于可用了
可以参考这个网址了解一下css3 的filter:
4.新增“网站对应的app”的提示条smart app banner
这种提示条会出现在你的网页上部。当用户在ios6的safari上打开你的网页时，如果你的站点在App Store中有对应的app，这个条幅将会展示，并且用户可前往下载或直接打开，分别如下图所示：
具体实现方法，在网页的html的head部分增加下面的代码：
1
| <meta name="apple-itunes-app" content="app-id=你的应用的app id" /> |
注意，如果用户将你的网站“添加到主屏”，且是点击主屏上的图标打开，并且你的网站设置了
1
| <meta name="apple-mobile-web-app-capable" content="yes" /> |
这个app banner条是不会出现的。
|
