IE9以下でSCRIPT438エラーするJavaScriptコード、id名と変数名がかぶると駄目?

社内の古(いにしえ)のWebサービスのメンテをしている過程で、InternetExplorer9以下の時、JavaScriptが正常に動いていない状況に出くわした…。未だに根本的な原因が分からず。誰か教えて…。

SCRIPT438: Object doesn't support property or method IE

これがF12の開発者ツールで表示されるエラー。

該当コード

<html>
<body>
<div id="hoge"></div>
<script>
hoge = document.getElementById("hoge"); // エラーにならない
function piyo() {
	hoge = document.getElementById("hoge"); // エラーになる
	var hoge = document.getElementById("hoge"); // エラーにならない
}
piyo();
</script>
</body>
</html>

これをIE9以下で表示させると上記のSCRIPT438エラーになる。

発生条件

  • DOCTYPEなしの互換表示モード(Quirksモード)
  • var 宣言なし
  • 関数内でのみ再現
  • HTMLのid名と変数名が同じ

なぜか、id="hoge" と hoge変数の名前がかぶるとエラーになる。

対処方法

  • DOCTYPEちゃんとする
  • var 宣言ちゃんとする

まぁ、要はちゃんと書いていれば問題が起こらないようなケースなんだけど、古(いにしえ)すぎるWebサイトの場合、なんかよくありがちなケースに思える…。

Feed

最新記事

不定期!弊社のslackで話題になった技術tips集!😘 Vol.6

## 🐉 説明しよう!tips集とは!? 弊社のslackチャンネルには、各々が感じた、技術的なtipsを誰に向けるわけでもなく放り投げるチャンネルがあります! ↑こんな感じです。 この記事は既出であろうがな...

7367523?v=4
mmusasabi
2018年07月19日

不定期!弊社のslackで話題になった技術tips集!😘 Vol.5

## 🐉 説明しよう!tips集とは!? 弊社のslackチャンネルには、各々が感じた、技術的なtipsを誰に向けるわけでもなく放り投げるチャンネルがあります! ↑こんな感じです。 この記事は既出であろうがな...

7367523?v=4
mmusasabi
2018年07月17日

エンジニアの評価制度として「技術力評価会」を開催したら良かった話

エンジニアの能力を比較して評価するのって難しいですよね🤢 だから今年から弊社では「**技術力評価会**」というのを開催するようになりました! まぁ、僕、評価者じゃないんで普通に出席して傍聴した感想をつらつらと記載し...

7367523?v=4
mmusasabi
2018年07月12日