IE9のDOMイベントについて調べてみた

JavaScript


タイトルはかなり釣りです(ぇ


IEが忌み嫌われる原因の1つにIE独自仕様があります。
DOMイベントはその中の1つです。
W3Cで標準のDOMイベントについて規定されていますが、
IEでは別の命名で実装されているので、
IEのときだけ別のイベントを呼びだす必要があります。
(例えばイベントを起動するcreateEventはIEではcreateEventObjectになっている。)


例えばこんな感じです。

if (/*@cc_on!@*/false) { // IEかどうか判定
  var event = document.createEventObject();

  ・・・・

}else{
  var event = document.createEvent("HTMLEvents"); 

  ・・・

}


それがIE9からDOM level3に準拠するようになったので、
createEventが使えるようになり、createEventObjectが非推奨になりました。


Legacy DOM events are no longer supported (Windows) | Microsoft Docs


そのため、IE9の場合はcreateEventObjectではなく、createEventを実行しなければなりません。
ただし、上のようにIEで判定していると、createEventObjectのほうにいってしまうので、
IE9かどうかで更に判定を加える必要があります。


IE9かどうかの判定は次のブログを参考にしました。


JavaScript とかによるブラウザ判定方法のまとめ - A Memorandum

var appversion = window.navigator.appVersion.toLowerCase();
if ((/*@cc_on!@*/false) && appVersion.indexOf("msie 9.") == -1) { // IE8以前かどうかチェック
  var event = document.createEventObject();

  ・・・・

}else{
  var event = document.createEvent("HTMLEvents"); 

  ・・・

}


また、ブラウザのバージョンを見なくても、
createEventが実行可能かどうかで判定したほうがスマートです。

if (document.createEvent) { // I以前かどうかチェック
  var event = document.createEvent("HTMLEvents"); 

  ・・・

}else{
  var event = document.createEventObject();

  ・・・・

}


個人的に使っているライブラリがIE9だとエラーが発生したので、
その原因を色々と調べてみたところ、
上の原因でエラーが出ていたのでちょっとまとめてみました。