IE11はたったの1行では判別できなくなる!?
IE11では@cc_onステートメントを利用したハックが使えなくなった
タイトルは釣りですw
document.documentMode === 11
と、1行で判別できます。
ただし、IE11を他のIEと一緒くたにして扱うと弊害の方が多いです。
IE11の変更点は、IE11 Preview における互換性の変更点 (Preliminary)にMS自身がまとめているが、そこに書かれていないことで、影響が大きそうなものが一つある。
従来のIE判別で重用されてきたIEかどうかをたったの1行で判別する方法が効かない。
つまり、コメント(/* */
)で囲まれた@cc_onステートメントは文字通り単なるコメントとして無視される。
onclick="alert(/*@cc_on!@*/false)"
)
IE10までは"true"、IE11とIE以外は"false"
一方、IE独自実装のdocument.documentModeは依然有効(というか認識される)。
IE判別のコードとして
var _isMSIE = /*@cc_on!@*/false,
_ieVersion = (function(_doc, reg) {
return _doc.documentMode ? _doc.documentMode :
_isMSIE && _nav.userAgent.match(reg) ? RegExp.$1 * 1 : 0;
})(document, /MSIE\s([0-9]+[\.0-9]*)/);
この例では、IE11だと_isMSIEにはfalseが入り、_ieVersionは11が入る。
ということで、document.documentModeをみれば実は1行でもIEかどうかは判別可能ではあるがw、それはさておき、_isMSIEだけで判別していると、IE11はIEじゃないブラウザとして処理されることになるので、それによって思わぬ落とし穴に嵌りこむ可能性があるかもしれない。
もし、IE11も含めて確実にIEであることを見分けることが必要だという場合には、
if(!_isMSIE && _ieVersion < 1) {
// not IE
}
else {
// IE
}
とするか、いっそIEの判定コードを、例えば、
var _ieVersion = (function(_doc, reg) {
return _doc.documentMode ? _doc.documentMode :
/*@cc_on!@*/false && _nav.userAgent.match(reg) ? RegExp.$1 * 1 : 0;
})(document, /MSIE\s([0-9]+[\.0-9]*)/),
_isMSIE = _ieVersion > 0 ? true : false;
と、このように変更しておいた方がいいかもしれない。
もっとも、IE11のWeb標準への対応状況を見る限り、IE11をこれまでのIEと同等のブラウザとして扱う必要がでてくるケースが今のところあまり思いつかないので、自分はたぶんやらないけどw(IE11固有のバグ回避くらいかなぁ?)
おまけ
@cc_onステートメントを利用したハックの弱点は、ClosureCompilerとかにかけると/*@cc_on!@*/
がコメントとして削除されてしまうところにある。
そこで、@cc_onを使わずに、IE8まで使えていた別のハック('\v' == 'v'
)の例も一応挙げておく。
var _ieVersion = (function(_doc, reg) {
return _doc.documentMode ? _doc.documentMode : '\v' == 'v' && navigator.userAgent.match(reg) ? RegExp.$1 * 1 : 0;
})(document, /MSIE\s([0-9]+[\.0-9]*)/),
_isMSIE = _ieVersion > 0 ? true : false;
これならClosureCompilerにかけてもダイジョーV(古杉…
"IE11はたったの1行では判別できなくなる!?"へのTwitter上でのコメントやRT
12件のツイートがあります。
ツイート 1
asamuzaK.jp : IE11でちょっとだけ注意すべき点 / IE11のプレビュー版を触っていて気づいたことのメモ http://t.co/6VUpE3zHL4
ツイート 2
記事のタイトルを釣り方面にしてみたw / asamuzaK.jp : IE11はたったの1行では判別できなくなる!? / IE11では@cc_onステートメントを利用したハックが使えなくなった http://t.co/6VUpE3zHL4
ツイート 3
おまけを追記 / asamuzaK.jp : IE11はたったの1行では判別できなくなる!? / IE11では@cc_onステートメントを利用したハックが使えなくなった http://t.co/6VUpE3zHL4
ツイート 4
実際の動作サンプル(つーてもalert出すだけだがw)も追記 / asamuzaK.jp : IE11はたったの1行では判別できなくなる!? / IE11では@cc_onステートメントを利用したハックが使えなくなった http://t.co/6VUpE3zHL4
ツイート 5
最近、textshadowの記事に並らぶ勢いでIE11判別のこの記事のアクセスが増えている。 でも記事内でも触れているけど、IE11はFirefoxやChromeと遜色ないので、あえてIEだと判別する必要性はほとんどないと思うよ / http://t.co/6VUpE3zHL4
ツイート 6
ちなみに、うちのサイトではもうその@cc_onステートメントすら使うのをやめている じゃあなんであんな記事を公開したのかって?w 偶々気づいたから…w / http://t.co/6VUpE3zHL4
ツイート 7
【自分速報w】Googleのウェブマスターによると、ついにIE11判別の記事へのアクセスがtext-shadow for MSIEの記事を超えた模様 / http://t.co/6VUpE3zHL4 http://t.co/GuubZaudj3
ツイート 8
.@ememra ツイートなさるときにURLの末尾が切り捨てられたのか、リンクが別のところを指してますw 正しくは http://t.co/6VUpE3zHL4
ツイート 9
先ほどのIE11の記事のURL、正しくはこちらでした! http://t.co/uW4JIpnU9f
ツイート 10
RT @ememra: 先ほどのIE11の記事のURL、正しくはこちらでした! http://t.co/uW4JIpnU9f
ツイート 11
詐欺だ、やっぱIEさんは空読まないですね…|asamuzaK.jp : IE11はたったの1行では判別できなくなる!? / IE11では@cc_onステートメントを利用したハックが使えなくなった http://t.co/QRJizWywXv @asamuzakjpさんから
ツイート 12
http://t.co/m4IlnNugHZ #pocket2twitter