让针对 Webkit 优化的网站兼容 WP8 IE10
程序员文章站
2022-05-21 10:43:18
...
微软Windows Phone开发者博客今日发表了一篇博文，阐述了如何让针对Webkit浏览器（iOS或Android）优化的网站完美运行于Windows Phone 8的IE10浏览器上。
微软表示，由于IE10大大改善了对于HTML5的支持，因此，开发者可以轻松使针对WebKit浏览器优化的网站也支持IE10，这意味着开发者只需更改少量的代码，即可为用户提供统一的浏览体验。
第1步：检测Windows Phone 8版IE10浏览器
微软之前公布了IE10的user-agent字符串：
这个过程完成后，如果还存在差异，最好采用特征检测，或者参照其他编写跨浏览器代码的最佳实践。需要注意的是，WP8中的IE10不支持Flash视频，因此，请确保网站中使用的是HTML5视频。
此外，还需要更新网站依赖的第三方库，如jQuery Mobile，确保支持最新的浏览器。
第2步：确保使用标准模式
确保IE10以最符合标准的模式来渲染你的网站。可以采用以下方式：
你还需要对网站的一些代码进行更改，最简单的方式是，将一些针对WebKit的特定CSS属性或JavaScript方法，更改为不带前缀的标准形式或带MS前缀的形式。
详见：CSS and DOM API updates
第4步：更新触摸和鼠标事件
WebKit和IE10对于触摸和鼠标事件的处理是不同的。WebKit的触摸事件接口与鼠标处理事件是分开的，而IE10将触摸、鼠标和手写笔事件整合到了一个接口中。因此，需要对代码进行调整。
详见：Updating touch and pointer events
第5步：处理不标准的行为
最后需要处理其他未形成W3C标准的方法。在这些情况下，WebKit和IE10解决方案可以共存于一个网站中。
Via Windows Phone开发者博客
微软表示，由于IE10大大改善了对于HTML5的支持，因此，开发者可以轻松使针对WebKit浏览器优化的网站也支持IE10，这意味着开发者只需更改少量的代码，即可为用户提供统一的浏览体验。
第1步：检测Windows Phone 8版IE10浏览器
微软之前公布了IE10的user-agent字符串：
Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; ARM; Touch; IEMobile/10.0; <Manufacturer>; <Device> [;<Operator>])
这个过程完成后，如果还存在差异，最好采用特征检测，或者参照其他编写跨浏览器代码的最佳实践。需要注意的是，WP8中的IE10不支持Flash视频，因此，请确保网站中使用的是HTML5视频。
此外，还需要更新网站依赖的第三方库，如jQuery Mobile，确保支持最新的浏览器。
第2步：确保使用标准模式
确保IE10以最符合标准的模式来渲染你的网站。可以采用以下方式：
- 使用HTML5 doctype：<!DOCTYPE html>
- 可以在HTTP头中添加<meta http-equiv="x-ua-compatible" content="IE=edge" />指定使用最新的IE版本来渲染
你还需要对网站的一些代码进行更改，最简单的方式是，将一些针对WebKit的特定CSS属性或JavaScript方法，更改为不带前缀的标准形式或带MS前缀的形式。
详见：CSS and DOM API updates
第4步：更新触摸和鼠标事件
WebKit和IE10对于触摸和鼠标事件的处理是不同的。WebKit的触摸事件接口与鼠标处理事件是分开的，而IE10将触摸、鼠标和手写笔事件整合到了一个接口中。因此，需要对代码进行调整。
详见：Updating touch and pointer events
第5步：处理不标准的行为
最后需要处理其他未形成W3C标准的方法。在这些情况下，WebKit和IE10解决方案可以共存于一个网站中。
Via Windows Phone开发者博客