0

我在具有以下 HTML 的网页上有一个图像映射：

<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 获取对区域元素的引用：

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

我成功地获得了参考：

  • Safari 6 (OS X)
  • 铬 26 (OS X)
  • 火狐 21 (OS X)
  • 铬 27 (XP)
  • 铬 27 (W7)
  • 铬 (W8)。

但不在：

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

当它工作时，我得到对 HTML 区域元素的引用，但当它不起作用时，我得到对文档的引用。以下是控制台日志消息：

在职的：

HTMLAreaElement

不工作：

http://localhost/index.html

我知道如何解决这个问题，但我试图了解为什么会这样？为什么 getElementById 不适用于图像地图区域元素？

感谢您的任何想法。

4

1 回答 1

1

似乎这只是与那些浏览器中区域元素上的“toString”方法有关。无论出于何种原因，它都会打印href. 但是，这只是打印出来的。的实际结果getElementById仍然是区域元素。

例如，如果您console.log(document.getElementById('seg-1').shape)在那些浏览器中使用，它仍然会正确打印“poly”。

于 2013-05-29T22:24:14.197 回答