FireFoxのDOM変数へのアクセスを妨げる厳密なdoctype
質問
これがよく知られている「もの」なのか、Firefoxのどのバージョンでも新しいものなのか、それ自体が更新されただけなのかわかりません。ここで質問します。
次のような最も単純な形式で、IDで直接アクセスしようとしているDOMにDIVがあります:
alert(btnTest.id);
これはすべてのブラウザーで正常に機能しますが、Firefoxで問題が発生し、実際にはブラウザーが奇妙な「壊れた」状態になりました。
私が得ていたエラーは「btnTestが定義されていません」でした。 Safari、Internet Explorer、Chromeではこのエラーは発生しませんでした。
HTMLタグが一致していないか、javascriptの中括弧などが欠落していると思いました。最終的にすべてを削除した後、DOCTYPEを削除しようとしました。突然Firefox(v 3.0.10)で、期待どおりに正しいIDを返し始めました。
何が起こっている!!! ?確かに「厳格」モードでは、名前付き要素にアクセスできます。そうでない場合は、他のすべてのブラウザーで許可されます。
注: $( '#btnTest')[0] .idで簡単に回避できます。これは、より良い解決策。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" class="blueCircles">
<head>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script>
$(function() {
alert("ID retrieved through jQuery: " + $('#btnTest')[0].id);
alert("ID retrieved by accessing global variable: " + btnTest.id);
});
</script>
</head>
<body>
<div id="btnTest">
</div>
</body>
</html>
解決
W3C仕様には、 id
属性を持つ要素のグローバルスクリプティングスコープでオブジェクト参照を確立する必要があるという記述はありません。これは、不必要にグローバル名前空間を汚染すると見なされ、紛らわしいエラー。
Firefoxは、IE互換性の目的で、互換モードで実行しているときに参照を確立します。 Johnny Stenbackはこのサポートを追加するためのバグの3番目のコメントで説明しています標準モードではサポートされていません:
この機能は標準に影響します たとえば、準拠コード グローバルの存在[ sic ]をチェックします 一度だけ設定する変数。と この変更、その「可変」は[ sic ]は 内の要素への参照 ドキュメント、およびコードが動作しない場合があります 開発者が意図した方法。
それが私たちが作ることにした理由です この癖のみ。