ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptマルチブラウザ対応

JavaScriptマルチブラウザ対応

高洛峰
高洛峰オリジナル
2016-11-28 11:24:071068ブラウズ

複数のブラウザと互換性のある Javascript
1. Document.formName.item("itemName") の問題
問題の説明: IE では、document.formName.item("itemName") または document.formName.elements["elementName" を使用できます。 ] ;Firefox では、document.formName.elements["elementName"] のみを使用できます。
解決策: document.formName.elements["elementName"] を一律に使用します。
2. コレクション クラス オブジェクトの問題

問題の説明: IE では、() または [] を使用してコレクション クラス オブジェクトを取得できますが、Firefox では、[ ] のみを使用してコレクション クラス オブジェクトを取得できます。
解決策: コレクション オブジェクトを取得するには [] を一律に使用します。
3. カスタム属性の問題
問題の説明: IE では、通常の属性を取得するメソッドを使用するか、getAttribute() を使用してカスタム属性を取得できますが、Firefox では getAttribute() のみを使用できます。カスタム属性を取得します。
解決策: getAttribute() を通じてカスタム属性を均一に取得します。
4. eval("idName") の問題
問題の説明: IE では eval("idName") または getElementById("idName") を使用して ID idName を持つ HTML オブジェクトを取得できますが、Firefox ではのみ使用できます。 getElementById(" idName") を使用して、id idName の HTML オブジェクトを取得します。
解決策: getElementById("idName") を一律に使用して、idName の ID を持つ HTML オブジェクトを取得します。
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 属性の問題

問題の説明: IE の input.type 属性は読み取り専用ですが、Firefox の input.type 属性は読み取り/書き込み可能です。
解決策: input.type 属性を変更しないでください。変更する必要がある場合は、最初に元の入力を非表示にしてから、同じ位置に新しい入力要素を挿入します。
8. Window.event の問題
問題の説明: window.event は IE でのみ実行できますが、Firefox では実行できません。これは、Firefox のイベントがイベントが発生する場面でのみ使用できるためです。
解決策: イベントが発生する関数にイベント パラメーターを追加し、関数本体で var myEvent = evt?evt:(window.event?window.event:null) を使用します (仮パラメーターが evt であると仮定します)
例:
< input type="button" onclick="doSomething(event)"/>