IE11-IE不再任性了-关于attachEvent

今天解决了一个IE11的兼容问题，关于attachEvent的。

控件是ActiveX的，需要监听一个控件相关的事件。蓦然发现attachEvent在IE11不支持了...attachEvent不是IE专有的么？是啊,这是IE专属呃，这么多年，不离不弃。IE的attachEvent不支持捕获阶段的事件处理程序，并且同一个处理程序能添加多次。非标准的IE专属，在IE11，彻底自己抛弃了...

IE11不再任性，走上了标准化的道路...

问题至此并没有解决，使用addEventListener仍然没有监听到ActiveX的事件，最后在MSDN找到了解决方案：

<!DOCTYPE html>
<html>
    <head>
        <title>TestEvent Example HTML</title>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script language='javascript' for="testAxEvent" event="testEvent(szType, szValue)">
        // Test 1 - statically load the script (This is the basis for the hack)
        // Works on IE8, IE9, IE10 and IE11
            var MSG = document.getElementById("msg");
            MSG.innerHTML = szType + " : " + szValue;
        </script>
    </head>
    <body>
        <table>
            <tr>
                <td>
                    <OBJECT ID='testAxEvent' CLASSID='CLSID:BA19A985-C93E-491B-B801-2EB7F903C8CE' codebase="testAxEvent.cab"></OBJECT>
                </td>
            </tr>
            <tr><td  height='30'></td></tr>
            <tr>
                <td align=center><font size=5><div id='msg'></div></font>    
            </tr>
        </table>
    </body>
</html>

监听ActiveX事件@IE11

另外还有几个方案，可参看：

https://social.msdn.microsoft.com/Forums/ie/en-US/47eccb01-8089-4653-a0ce-45e9ced5e228/addeventlistener-for-activex-events-in-ie11?forum=iewebdevelopment

好吧，那就再看看IE11，在兼容性上，做了哪些更改吧...

User-agent 字符串更改
文档模式更改
传统 API 添加、更改和删除
URL 字符编码
自定义数据属性
SVG“pointer-events”属性的 HTML 支持
更新反映对基于标准的规范的更改
- 弹性框（“Flexbox”）布局更新
- 突变观察者
- 指针事件

User-agent 字符串更改

对于许多传统网站，针对 IE11 的一些最明显的更新涉及 user-agent 字符串。以下是针对 Windows 8.1 上的 IE11 报告的内容：

JavaScript          

Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko

用户代理字符串的特定值会因诸多因素（例如，运行浏览器的操作系统、运行浏览器的设备以及网站是否采用兼容性视图显示）而有所不同。有关详细信息，请参阅用户代理字符串更改。

与先前版本的 Internet Explorer 一样，部分 user-agent 字符串会因环境条件的不同而有所差异。以下是针对 Windows 7 上的 IE11 显示的字符串：

JavaScript          

Mozilla/5.0 (Windows NT 6.1; Trident/7.0; rv:11.0) like Gecko

如果将这些 user-agent 字符串与早期版本的 Internet Explorer 报告的字符串进行比较，你会发现以下更改：

兼容 ("兼容") 和浏览器 ("MSIE") 令牌已删除。
"like Gecko" 令牌已添加（以便与其他浏览器一致）。
浏览器版本现在由新版本 ("rv") 令牌报告。

这些更改有助于防止 IE11 被（错误）标识为较早的版本。

通常，应避免检测特定浏览器或浏览器版本。基于此类测试的假设易于在更新浏览器时导致误报。相反，在你需要使用功能时检测功能并使用渐进增强为不支持所需功能的浏览器或设备提供简化体验。

在极少数情况下，必须唯一地标识 IE11。使用 Trident 令牌来执行此操作。

文档模式更改

Windows Internet Explorer 8 中引入了文档模式，这些模式可以帮你实现从早期版本的浏览器支持的功能转换为现行标准和其他浏览器指定的功能。 Windows Internet Explorer 的后续版本继续使用此转换，方法是引入对行业标准所定义功能的支持的同时，引入模拟早期版本所支持功能的新文档模式。

当许多网站已更新为向其他浏览器提供更丰富的体验时，某些网站仍继续使用现有的传统功能支持向 Internet Explorer 提供传统体验，即便最新版本的浏览器支持为其他浏览器呈现的体验。

从 IE11 开始，边缘模式成为首选文档模式；它代表可供浏览器使用的现行标准的最高支持。

使用 HTML5 文档类型声明启用边缘模式：

HTML           

<!doctype html>

Internet Explorer 8 中引入了边缘模式并且每个后续版本中也提供了该模式。注意，边缘模式支持的功能会限制为呈现内容的特定浏览器版本支持的功能。

从 IE11 开始，文档模式被弃用，除了临时情况外不应再使用。请确保更新依赖于传统功能和文档模式的站点，以便反映现行标准。

如果必须针对特定文档模式，以便在重新运行站点来支持现行标准和功能时站点能够工作，则请注意，你使用的是过渡功能，以后的版本中可能不提供该功能。

如果你当前针对传统文档模式使用 x-ua-compatible 标头，则你的站点可能无法反映适用于 IE11 的最佳体验。有关详细信息，请参阅 modern.ie。

传统 API 添加、更改和删除

许多网站查找支持传统 (HTML4) 功能的浏览器，目的是提供针对早期浏览器优化的体验。对于支持传统功能和现行标准（如 HTML5、CSS3 等）的浏览器，这是一个问题。如果站点在搜索现行标准支持之前检测到传统功能，则可以为支持现行标准的浏览器提供传统体验和更丰富的体验。

因此，IE11 添加、更改、删除了许多默认的传统功能：

navigator.appName 属性现在会返回 "Netscape" 以反映 HTML5 标准和匹配其他浏览器的行为。
navigator.product 属性现在会返回 "Gecko" 以便反映 HTML5 标准和匹配其他浏览器的行为。
XDomainRequest 对象被 XMLHttpRequest 的 ORS 替换。
已添加对 __proto__ 的支持。
已添加 dataset 属性。

另外，为了支持现行标准指定的功能，已删除若干传统 API 功能：

删除 API 功能	替代功能
attachEvent	addEventListener
window.execScript	eval
window.doScroll	window.scrollLeft、window.scrollTop
document.all	document.getElementById
document.fileSize、img.fileSize	使用 XMLHttpRequest 可提取源
script.onreadystatechange 和 script.readyState	script.onload
document.selection	window.getSelection
document.createStyleSheet	document.createElement("style")
style.styleSheet	style.sheet
window.createPopup	使用 div 或 iframe（zIndex 值很高）
二进制行为	变化；使用基于标准的等效，如 canvas、SVG 或 CSS3 动画
传统数据绑定	使用框架提供的数据绑定，如 WinJS

这些更改在某种程度上可阻止编得不好的 user-agent 检测机制（错误地）将 Internet Explorer 标识为较早版本。因此，依靠现行标准的站点按预期显示。

URL 字符编码

IE11 更改了 URL 的字符编码。具体来说，现在使用 UTF-8 字符编码对查询字符串和 XHR 请求进行编码。

此更改会影响所有 URL，但以下除外：

定位名称组件（也称为“片断”）。
用户名和密码组件。
file:// or ftp:// protocol links。

这些更改与其他浏览器行为匹配并简化了跨浏览器 XHR 代码。

自定义数据属性

IE11 添加了对 HTML5 自定义数据属性和 dataset 属性的支持，可以提供对它们的编程访问权限。你可以使用 data- 前缀后跟属性名称的方式来向元素分配数据属性：

HTML           

<div data-example-data="Some data here"></div>

要获取或设置数据属性的值，请使用此语法：

JavaScript           

   // to get
   var myData = element.dataset.exampleData;
   // to set
   element.dataset.exampleData = "something new";

SVG“pointer-events”属性的 HTML 支持

从 IE11 开始，也支持 pointer-events 作为 HTML 元素上的 CSS 属性，其效果如下：

值	描述
无	该元素不会触发指针输入事件（无法进行点击测试）。
其他有效的指针事件值	该元素会触发指针输入事件。

默认情况下将继承 pointer-events 属性，所以会影响应用该属性的元素的所有后代。

更新反映对基于标准的规范的更改

IE11 还包括用于支持基于标准的 Web 规范（已更新或仍在发展）的更新。这其中包括与支持下列功能相关的更改：

弹性框（“Flexbox”）布局更新

使用 IE11，你可以更新站点来与最新的弹性框标准保持一致并简化跨浏览器的代码。

有关详细信息，请参阅"弹性框（“Flexbox”）布局更新"。

突变观察者

突变观察者是 IE11 中新的标准 Web 平台功能，提供了对突变事件支持的所有相同方案的快速执行直接替代，以及对属性更改事件支持的方案的替代。

有关详细信息，请参阅"突变观察者"和"将突变事件和属性更改事件迁移到突变观察者"。

指针事件

为了符合万维网联合会 (W3C) 指针事件规范的候选推荐，与 Internet Explorer 10 相比，IE11 实现已略有更改。

posted on 2014-12-03 20:04 清姿阅读(9958) 评论(2) 编辑收藏举报