IE:覚えておくべきバグdocument.getElementById()

議論される問題についての情報は、JavaScriptとクロスブラウザの互換性について詳しく調べ始めたすべての人にとって確かに役立つでしょう。 次のコードを検討してください。



 <HTML>
 <HEAD>
 <meta name = "description" content = "Webサイトの説明がここに表示されます。">
 <SCRIPT src = "http://www.prototypejs.org/assets/2008/9/29/prototype-1.6.0.3.js"> </ SCRIPT>
 </ HEAD>
 <BODY>
	 <フォーム名= "テスト">		
		 <INPUT type = "text" name = "description" id = "description" value = "test value">
	 </ FORM>
 <SCRIPT>
 Event.observe(window、 'load'、function(){
	 alert( "説明の値は '" + $ F(' description ')+ "'");  
 });
 </ SCRIPT>
 </ BODY>
 </ HTML>


異なるブラウザでテストします。 Firefox、Safari、Opera、Konqueror、Chromeでは、このコードは意図したものを表示します。テキストDescriptionの値を持つアラートは 'test value'です。 しかし、IEではそうではありません-通常のランタイムエラーが発生します。



IEのもう1つの悲しい真実は、 $ F()のプロトタイプとなるdocument.getElementById()関数が正しく機能しないことです。 要素にname属性がある場合、ID自体も明示的に指定されていても、IDで検索するときにその値が使用されます。 したがって、IEの観点から見ると、DOMのこの例には、ID = "description"の2つの要素があり、これらの最初の要素はMETAタグであり、返されます。 ちなみに、この例では、偶然ではなくMETAタグを使用しました。この場合、このレーキを初めて踏んだので、目でエラーを探し始めたとき、METAはどういうわけかあまり目立ちません。 :)



この問題は古く、そのように残っているようです-このバグは修正されないという噂があります。修正すると、それがどんなに奇妙に聞こえても、下位互換性に違反するためです:) IEは(私の経験では) Microsoft Script Editorを使用して最も便利です。 Firebug Liteも言及する価値がありますが、その機能は限られています。



All Articles