JavaScript DOM Map 对象 areas 集合

• 

  Map 对象 areas 集合

  areas集合返回图像映射中所有<area>元素的集合。

  注意：集合中的元素按源代码中的显示进行排序。

  提示：要返回指定了href属性的所有<area>元素的集合，请使用links集合。

  找出特定图像映射中有多少<area>元素：

  var x = document.getElementById("planetmap").areas.length;

  尝试一下
• 

  浏览器支持

  项	IE/Edge	Chrome	FireFox	Safari	Opera
  集合
  areas	支持	支持	支持	支持	支持

• 

  语法

  返回areas方法：

  MapObject.areas
• 

  属性值

  值	描述
  length	返回集合中<area>元素的数量。注意：此属性是只读的

• 

  方法

  值	描述
  [index]	返回具有指定索引的集合中的<area>元素（从0开始）。 注意：如果索引号超出范围，则返回null
  item(index)	返回具有指定索引的集合中的<area>元素（从0开始）。 注意：如果索引号超出范围，则返回null
  namedItem(id)	返回具有指定标识的集合中的<area>元素。 注意：如果id不存在，则返回null

• 

  技术细节

  项目	描述
  返回值	一个HTMLCollection对象，表示文档中图像映射中的所有<area>元素。集合中的元素按照它们在源代码中的显示进行排序

• 

  更多例子

  获取图像映射中第一个<area>元素的URL：

  var x = document.getElementById("planetmap").areas[0].href;

  尝试一下

  项目（索引），获取图像映射中第一个<area>元素的URL：

  var x = document.getElementById("planetmap").areas.item(0).href;

  尝试一下

  namedItem（id），在图像映射中获取id =“myArea”的<area>元素的URL：

  var x = document.getElementById("planetmap").areas.namedItem("myArea").href;

  尝试一下

  遍历图像映射中的所有<area>元素并输出每个区域的形状：

  var x = document.getElementById("planetmap");
  var txt = "";
  var i;
  for (i = 0; i < x.areas.length; i++) {
    txt = txt + x.areas[i].shape + "<br>";
  }

  尝试一下