IE と Firefox_javascript スキルに関する JavaScript 互換性に関する注意事項を整理する

1. document.form.item の問題
(1) 既存の問題:
既存のコードには document.formName.item("itemName") のような使用できないステートメントが多数あります。 Firefox の場合 (Firefox) で
(2) ソリューションを実行します:
代わりに document.formName.elements["elementName"] を使用します
(3) その他の
については、2 を参照してください
2 . コレクション クラス オブジェクトの問題
(1) 既存の問題:
既存のコード内の多くのコレクション クラス オブジェクトは、アクセス時に () を使用できますが、Firefox では受け入れられません。
(2) 解決策:
添字演算として代わりに [] を使用します。例: document.forms("formName") は document.forms["formName"] に変更されます。
別の例: document.getElementsByName("inputName")(1) が document.getElementsByName("inputName")[1]
(3) その他
3 に変更されました。 >
(1) 既存の問題: Firefox ブラウザでは window.event を使用しても実行できません
(2) 解決策:
Firefox のイベントはイベントが発生する場面でしか使用できません。まだ解決できません。次のように変更できます:
元のコード (IE で実行可能):

...


新しいコード (IE および Firefox で実行可能) :
...


さらに、新しいコードの最初の行が変更されず、古いコードと同じである場合 (つまり、gotoSubmit 呼び出しは行われません)パラメーターを指定します)、IE でのみ機能します。実行されますが、エラーは発生しません。したがって、このソリューションの tpl 部分は依然として古いコードと互換性があります。
4. HTML オブジェクトの ID をオブジェクト名として使用する問題
(1) 既存の問題
IE では、HTML オブジェクトの ID をそのままオブジェクト名として使用できます。ドキュメントの下位オブジェクト変数名。 Firefox にはありません。
(2) 解決策
オブジェクト変数として idName の代わりに getElementById("idName") を使用します。
5. idName 文字列を使用してオブジェクトを取得する場合の問題点
(1) 既存の問題点
IE では、eval(idName) を使用して idName を持つ HTML オブジェクトを取得できます。 Firefoxで。
(2) 解決策
eval(idName)の代わりにgetElementById(idName)を使用します。
6. 変数名がHTMLのオブジェクトIDと同じである問題
(1) 既存の問題
FirefoxではオブジェクトIDが名前として使用されていないため、 HTML オブジェクトが使用可能 IE では HTML オブジェクト ID と同じ変数名が使用できます。
(2) 解決策
変数を宣言するときは、IE でも正常に動作するように、曖昧さを避けるために必ず var を付けます。
さらに、エラーを減らすために、HTML オブジェクト ID と同じ変数名を使用しないことをお勧めします。
(3) その他
質問 4 を参照
7. Event.x およびevent.y の問題
(1) 既存の問題
IE では、イベント オブジェクトがありますは x、y 属性であり、Firefox では使用できません。
(2) 解決策
Firefox では、event.x に相当するのは、event.pageX です。ただし、event.pageX は IE では使用できません。
したがって、event.x の代わりに、event.clientX が使用されます。この変数はIEにも存在します。
Event.clientX とevent.pageX には微妙な違いがありますが (ページ全体にスクロール バーがある場合)、ほとんどの場合は同等です。
まったく同じにしたい場合は、もう少し問題があります:
mX =event.x ?event.x :event.pageX
event.x の代わりに mX を使用します。 >(3)その他
event.layerXはIEとFirefoxに存在しますが、具体的な意味に違いがあるかどうかは未検証です。
8. フレームについて
(1) 既存の問題
IE では window.testFrame を使用してフレームを取得できますが、Firefox では取得できません
(2) 解決策
フレームの使用における Firefox と IE の主な違いは次のとおりです:
フレーム タグに次の属性が記述されている場合:

これにより、IE は ID または名前ウィンドウを介して対応するフレームにアクセスできますオブジェクト
と Firefox は、名前
を通じてのみ、このフレームに対応するウィンドウ オブジェクトにアクセスできます。 たとえば、上記のフレーム タグがトップ ウィンドウ内の htm に記述されている場合、次のように
ie にアクセスできます。 window.top .frameId または window.top.frameName を使用してこのウィンドウ オブジェクトにアクセスします
Firefox: これが window.top.frameName
経由でこのウィンドウ オブジェクトにアクセスする唯一の方法です。 さらに、window.top.document はFirefox と IE の両方で getElementById("frameId") を使用してフレーム タグ
にアクセスし、window.top.document.getElementById("testFrame").src = 'xx.htm' を使用してコンテンツを切り替えることができます。フレーム
を使用することもできます。top.frameName.location = 'xx.htm' を使用してフレーム
の内容を切り替えることもできます。フレームとウィンドウの説明については、「ウィンドウとフレーム」の記事を参照してください。 bbs
と /test/js/test_frame/ ディレクトリ内のテスト
----adun 2004.12.09 変更
9. Firefox では、定義した属性は getAttribute によって取得する必要があります。 ()
10. Firefox では、parentElement parement.children はありませんが、
parentNodeparentNode.childNodes
childNodes の添え字の意味は、IE と Firefox では DOM を使用します。指定すると、空のテキスト ノードが childNodes に挿入されます。
通常、この問題は、node.getElementsByTagName() を使用して回避できます。
HTML でノードが欠落している場合、IE と Firefox は、parentNode を異なる方法で解釈します。たとえば、

Firefox の input.parentNode の値は form ですが、IE の input.parentNode の値は空のノードです
Firefox の Node には、removeNode メソッドがありません。以下のメソッド node.parentNode.removeChild(node)
11.const の問題点
(1) 既存の問題点:
IE では const キーワードは使用できません。 const constVar = 32; など。これは IE の構文エラーです。
(2) 解決策:
const を使用せず、代わりに var を使用してください。
12. body オブジェクト
Firefox の本体はブラウザーによって body タグが完全に読み取られる前に存在しますが、IE は本体が完全に読み取られた後に存在する必要があります
13.
js で URL を記述する場合は、直接記述してください。たとえば、var url = 'xx.jsp?objectName=xx&objectEvent=xxx'; となります。 = url then URL が正常に表示されず、パラメーターがサーバーに正しく送信されない可能性が非常に高くなります
通常、サーバーはパラメーターが見つからないというエラーを報告します
もちろん、例外はありますtpl にある場合、tpl は xml 仕様に準拠しているため、要件 & は & として記述されます。
一般に、Firefox は js 内の & を認識できませんが、textNode には tagName 値がありません。 IE では、nodeName
の使用に問題があるようです (具体的な状況をテストしていませんが、IE が何度か停止しました)。
(2) 解決策: tagName を使用しますが、それが空かどうかを検出する必要があります。
15. 要素の属性

input.type 属性は IE では読み取り専用ですが、Firefox

16 では変更できます。 .all[name ] 問題
(1) 既存の問題:
IE では、getElementsByName() も document.all[name] も div 要素を取得するために使用できません (他に取得できない要素はありますか)わかりませんか？）