HTML DOM Map areas 集合
Map areas 集合
Map 对象实例
获取图片地图中 <area> 元素的数目：
var x = document.getElementById("planetmap").areas.length;
x 输出值为：
3
尝试一下 »
定义和使用
areas 集合返回图像地图中所有 <area> 元素的集合。
注意： 集合中的元素排序按源代码中的顺序。
提示： 如果需要返回所有 <area> 元素中指定的 href 属性集合 ，'你需要使用 links 集合。
浏览器支持
所有主流浏览器都支持 areas 集合。
语法
mapObject.areas
属性
| 属性 | 描述 |
|---|---|
| length | 返回集合中 <area> 元素的数目 |
方法
| 方法 | 描述 |
|---|---|
| [name_or_index] | 字符串或整数，指定要检索的元素 (index 以 0 为起始) |
| item(name_or_index) | 从集合中返回指定 index/name/id 的元素 |
| namedItem(name_or_id) | 从集合中返回指定名称的元素 (name 或 id 属性) |
更多实例
实例
[name_or_index]
获取图像地图中第一个 <area> 元素的URL：
var x = document.getElementById("planetmap").areas[0].href;
尝试一下 »
实例
item(name_or_index)
获取图像地图中第一个 <area> 元素的URL：
var x = document.getElementById("planetmap").areas.item(0).href;
尝试一下 »
实例
namedItem(name_or_id)
获取图像地图中 id="myArea" 的<area> 元素URL：
var x = document.getElementById("planetmap").areas.namedItem("myArea").href;
尝试一下 »
实例
获取图像地图中所有<area>元素的形状：
var x = document.getElementById("planetmap");
var txt = "";
for (var i = 0; i < x.areas.length; i++)
{
txt = txt + x.areas[i].shape + "<br>";
}
document.getElementById("demo").innerHTML = txt;
var txt = "";
for (var i = 0; i < x.areas.length; i++)
{
txt = txt + x.areas[i].shape + "<br>";
}
document.getElementById("demo").innerHTML = txt;
尝试一下 »