Map areas набор

определение и использование

area набор возвращает все <area> элемент набор.

Комментарий:Элементы набора сортируются по порядку их появления в исходном коде.

подсказка:если нужно вернуться ко всем определенным свойствам href <area> элемент пожалуйста, используйте links набор

Пример

Пример 1

Узнай, сколько элементов <area> есть в указанной карте изображений:

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

Попробуйте сами

Результат x:

3

Ниже страницы есть больше примеров TIY.

Синтаксис

mapObject.areas

Свойство

Значение Описание
length

Возвращает количество элементов <area> в наборе.

Комментарий:Эта свойство является только для чтения

Метод

Метод Описание
[index]

Возвращает элемент <area> с указанным индексом набора (начиная с 0).

Комментарий:Возвращает null, если номер индекса выходит за пределы диапазона.

item(index)

Возвращает элемент <area> с указанным индексом набора (начиная с 0).

Комментарий:Возвращает null, если номер индекса выходит за пределы диапазона.

namedItem(id)

Возвращает набор элементов <area> с указанным id.

Комментарий:Возвращает null, если id не существует.

Технические детали

Версия DOM: Core Level 2 Document Object
Возвратное значение:

Объект HTMLCollection, представляющий все элементы <area> в карте изображений документа.

Элементы набора сортируются по порядку их появления в исходном коде.

Поддержка браузеров

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Поддержка Поддержка Поддержка Поддержка Поддержка

Более примеров

Пример 2: [index]

Получите URL первого элемента <area> в карте изображений:

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

Попробуйте сами

Результат x будет:

https://www.codew3c.com/jsref/sun.html

Пример 3: item(index)

Получите URL первого элемента <area> в карте изображений:

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

Попробуйте сами

Результат x будет:

https://www.codew3c.com/jsref/sun.html

Пример 4: namedItem(id)

Получите URL элемента <area> с id="myArea" в карте изображений:

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

Попробуйте сами

Результат x будет:

https://www.codew3c.com/jsref/mercur.html

Пример 5

Пройди все элементы <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>";
}

Попробуйте сами

Результат x будет:

rect
circle
circle