0

次の HTML を含む Web ページにイメージ マップがあります。

<div class="container">
    <img src="image.png" usemap="#hotspots">
    <map name="#hotspots">
        <area id="seg-1" href="" shape="poly" coords="167,286,113,379,320,379,266,286,167,286"/>
        <area... />
        <area... />
        <area... />
        ...
    </map>
</div>

そして、次の JavaScript を使用して area 要素への参照を取得しようとしています。

var seg1 = document.getElementById("seg-1");

私は正常に参照を取得します:

  • サファリ 6 (OS X)
  • Chrome 26 (OS X)
  • Firefox 21 (OS X)
  • クロム 27 (XP)
  • クローム27（W7）
  • クロム (W8)。

しかし、そうではありません：

  • IE8 (XP)
  • IE9 (W7)
  • IE10 (W8)
  • Firefox 17 (XP)
  • Firefox 21 (W7)
  • Firefox 21 (W8)。

動作する場合は HTML area 要素への参照を取得しますが、動作しない場合はドキュメントへの参照を取得します。コンソール ログ メッセージは次のとおりです。

働く：

HTMLAreaElement

動作していません:

http://localhost/index.html

私はこれを回避する方法を知っていますが、なぜこれが起こっているのか理解しようとしていますか? getElementById がイメージ マップ エリア要素に対して機能しないのはなぜですか?

ご意見ありがとうございます。

4

1 に答える 1