IE11-IE再也不任性了-關於attachEvent

時間 2020-09-19

標籤 ie11 再也不任性關於 attachevent 简体版

原文原文鏈接

今天解決了一個IE11的兼容問題，關於attachEvent的。javascript

控件是ActiveX的，須要監聽一個控件相關的事件。驀然發現attachEvent在IE11不支持了...attachEvent不是IE專有的麼？是啊,這是IE專屬呃，這麼多年，不離不棄。IE的attachEvent不支持捕獲階段的事件處理程序，而且同一個處理程序能添加屢次。非標準的IE專屬，在IE11，完全本身拋棄了...html

IE11再也不任性，走上了標準化的道路...java

問題至此並無解決，使用addEventListener仍然沒有監聽到ActiveX的事件，最後在MSDN找到了解決方案：web

<!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=iewebdevelopmentcanvas

好吧，那就再看看IE11，在兼容性上，作了哪些更改吧...瀏覽器

User-agent 字符串更改
文檔模式更改
傳統 API 添加、更改和刪除
URL 字符編碼
自定義數據屬性
SVG「pointer-events」屬性的 HTML 支持
更新反映對基於標準的規範的更改
- 彈性框（「Flexbox」）佈局更新
- 突變觀察者
- 指針事件

User-agent 字符串更改app

對於許多傳統網站，針對 IE11 的一些最明顯的更新涉及 user-agent 字符串。如下是針對 Windows 8.1 上的 IE11 報告的內容：框架

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

用戶代理字符串的特定值會因諸多因素（例如，運行瀏覽器的操做系統、運行瀏覽器的設備以及網站是否採用兼容性視圖顯示）而有所不一樣。有關詳細信息，請參閱用戶代理字符串更改。ide

與先前版本的 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) 功能的瀏覽器，目的是提供針對早期瀏覽器優化的體驗。對於支持傳統功能和現行標準（如 HTML五、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 實現已略有更改。

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。