HTMLMapElement: areas 属性

基线 广泛可用

此功能已得到充分的建立，并在许多设备和浏览器版本中正常运行。它从以下日期起在所有浏览器中可用： 2015 年 7 月.

areas 是 HTMLMapElement 接口的只读属性，它返回与 <map> 元素关联的 <area> 元素集合。

值

一个 HTMLCollection 对象，包含 HTMLAreaElement 元素。

示例

html
<map id="image-map">
  <area shape="circle" coords="50,50,35" alt="left arrow" />
  <area shape="circle" coords="150,50,35" alt="right arrow" />
</map>
<img
  usemap="#image-map"
  src="left-right-arrow.png"
  alt="left right arrow image" />
<output></output>
js
const mapElement = document.getElementById("image-map");
const outputElement = document.querySelector("output");

for (const area of mapElement.areas) {
  area.addEventListener("click", (event) => {
    outputElement.textContent = `You clicked on the ${area.alt} area.\n\n`;
  });
}

结果

规范

规范
HTML 标准
# dom-map-areas-dev

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。

另请参阅