Firefox と IE の互換性の問題と解決策のまとめ_JavaScript スキル

多言語 Java Web サイトを開発する過程で、FF では正常に実行できるが IE では正常に実行できない、またはその逆のコードを多数発見しました。 JavaScript における IE と Firefox (Firefox) の非互換性と統一方法は次のようにまとめられます。

1. Firefox の externalHTML と互換性がありますが、FF には externalHtml メソッドはありません

コードをコピー コードは次のとおりです。

if (window.HTMLElement) {
HTMLElement.prototype. __defineSetter__("outerHTML" ,function(sHTML) {
var r=this.ownerDocument.createRange();
r.setStartBefore(this);
var df=r.createContextualFragment(sHTML);
this.parentNode.replaceChild(df,this);

HTMLElement.__defineGetter__("outerHTML",function() {
var attr;
var attrs =this.attributes;
var str="for (var i=0;i";
return str ">this.innerHTML ""
});

HTMLElement.__defineGetter__(" canHaveChildren",function( ) {
switch(this.tagName.toLowerCase()) {
case "エリア":
case "base":
case "basefont":
case "col":
case "frame":
case "hr":
case "img":
case "br":
case "input":
case " isindex":
case "link":
case "meta":
case "param":
return false;
}
return true;
});
}


2. コレクション クラス オブジェクトの問題

説明: IE では () または [] を使用してコレクション クラス オブジェクトを取得できますが、Firefox では [] のみを使用できます。コレクション クラス オブジェクトを取得します。解決策: コレクション オブジェクトを取得するには、一律に [] を使用します。

説明: IE では、次のメソッドを使用できます。通常の属性を取得するには、getAttribute() を使用することもできます。Firefox では、getAttribute() を使用してカスタム属性を取得することしかできません。 >
4.eval("idName") の問題


説明: IE では、eval("idName") または getElementById("idName") を使用して HTML を取得できます。 ID が idName のオブジェクト; Firefox では、idName の ID を持つ HTML オブジェクトを取得するには getElementById("idName") のみを使用します。 解決策: idName の ID を持つ HTML オブジェクトを取得するには、一律に getElementById("idName") を使用します。 .
5 .変数名が HTML オブジェクトの ID と同じである問題


説明: IE では、HTML オブジェクトの ID は次のようになります。ドキュメントの下位オブジェクトの変数名として直接使用されます。Firefox では使用できます。変数名は HTML オブジェクト ID と同じです。IE では使用できません。 解決策: document.idName の代わりに document.getElementById("idName") を使用します。エラーを減らすために同じ HTML オブジェクト ID を持つ変数名を使用しないことをお勧めします。変数を宣言するときは、あいまいさを避けるために常に var を追加してください。 🎜>6.const の問題

説明: Firefox では const キーワードまたは var キーワードを使用して定数を定義できますが、IE では var キーワードのみを使用して定数を定義できます。解決策: var キーワードを一律に使用して定数を定義します。

7.input.type 属性の問題

説明: input.type 属性は IE では読み取り専用です。 ; ただし、Firefox の input.type 属性は読み取りおよび書き込み可能です。

8.window.event の問題

説明: window.even は IE でのみ実行できます。 Firefox これは、Firefox のイベントはイベントが発生するサイトでのみ使用できるためです。 解決策:

IE: ...

IE&Firefox:

...

var list、index

list = document.getElementsByClassName(" classname1");
for (インデックス = 0; インデックス list[index].setAttribute(/* ... */); }


このような問題には、すべてのブラウザと互換性のある jQuery、Prototype、Google Closure などのライブラリを使用するのが最善です。これにより、対処にかかる時間を大幅に節約できます。これらの互換性の問題。

たとえば、jQuery の場合:

$(".home1").attr(/* ... */);


15.body question

Firefox の本体はブラウザーによって body タグが完全に読み取られる前に存在しますが、IE の本体はブラウザーによって body タグが完全に読み取られた後に存在する必要があります。
例:

Firefox:

コードをコピー コードは次のとおりです: < ;body >