各ブラウザは、document.getElemenntByIdなどの方法に対して、違いを実現します。

本論文はhttp://www.cnblogs.com/snandy/archive/2011/03/24/1993380.htmlから来ている。
 
すべてのWebフロントエンドの同僚はDcument.getElemenntByIdに非常に詳しいです。開発過程では、ページIDをxxの要素として取得することが多くなりました。元老級JSライブラリProttypeが流行してから、このように簡単に書くのが好きです。
？
1
2// 1function$(id){ returndocument.getElementById(id); }なぜこのように書くのか、次のように書かないと考えている人がいますか？
？
1
2// 2var$ = document.getElementById;このように書いた$はもっと簡潔です。documentの方法を変数にgetElement ByIdを、$でページIDをxxの要素として取得します。実際の方式2はIE 6/7/8で可能です。Firefox/Safari/Chrome/Operaは通用しません。また、自分でテストしてください。なぜFirefox/Safari/Chrome/Opera方式2で取得できないかというと、これらのブラウザでgetElement ByIdメソッドの内部実装にはthisに依存しなければならず、IEはthisを必要としないからです。あるいは、方法2は、Firefox/Safari/Chrome/Operaで呼び出したときにthisがなくなったという簡単な例である。
？
1
2
3
4
5
6
7
8
9// showfunctionshow(){alert(this.name);} // p ， name varp = {name:'Jack'}; show.call(p); // -> 'Jack'show(); // -> ''show.call(null); // -> ''<br>ショーの実装ではthisに依存していることが見られますので、呼び出し時の環境（実行コンテキスト）はname属性がないと期待の結果が得られません。言い換えれば、IE 6/7/8がdocument.getElementByIdを実現する際にはthisは使用されていませんが、IE 9/Firefox/Safari/Chrome/Operaはthisを使用する必要があります。ここでのthisはdocumentオブジェクトです。直接呼び出し方式2の場合は内部のthisはwindowオブジェクトですので、2はFirefox/Safari/Chrome/Operaでidによって正常に元素を取得できません。
もしdocument.getElementByIdの実行環境をwindowではなくdocumentに変えたら、正常に$を使うことができます。次のとおりです
？
1
2
3
4
5
6
7
8
9// document.getElementByIddocument.getElementById = (function(fn){    returnfunction(){         returnfn.apply(document,arguments);    };})(document.getElementById); // $，$ var$ = document.getElementById;また、ECMAScript 5にfunctionのために追加されたbind方法でも同様の効果が得られます。
？
1
2// 3var$ = document.getElementById.bind(document);しかし、現在の方式3はIE 9/Firefox/Chrome/サポートのみです。getElementByIdの場合を分析しましたが、以下のいくつかの方法は各ブラウザでの違いの原因がよく分かります。
？
1
2
3
4
5
6
7
8
9
10
11varprinf = document.write;prinf('<h3>Test prinf</h3>'); // IE6/7/8 ，  varprinfln = document.writeln;prinfln('<h3>Test prinfln</h3>'); // IE6/7/8 ，  varreload = location.reload;reload(); // IE6/7/8 ，  vargo = history.go; go(-2); // IE6/7/8 ，