tutoriais mais recente desenvolvimento web
 

Coleção áreas do mapa

<Mapa Objeto

Exemplo

Descobrir quantos <area> elementos existem em uma imagem-mapa específico:

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

O resultado x será:

3
Tente você mesmo "

Mais "Try it Yourself" exemplos abaixo.

Definição e Uso

A coleção áreas retorna uma coleção de todos os <area> elementos em uma imagem-mapa.

Note: Os elementos na coleção são classificadas como eles aparecem no código-fonte.

Dica: Para retornar uma coleção de todos <area> elementos que têm um atributo href especificado, use o ligações coleção.

Suporte navegador

Coleção
areas sim sim sim sim sim

Sintaxe

mapObject .areas

propriedades

Propriedade Descrição
length Retorna o número de <area> elementos na coleção.

Nota: Esta propriedade é somente leitura

Métodos

Método Descrição
[ index ] Retorna o <area> elemento da coleção com o índice especificado (starts at 0) .

Nota: Retorna null se o número de índice está fora do intervalo
item( index ) Retorna o <area> elemento da coleção com o índice especificado (starts at 0) .

Nota: Retorna null se o número de índice está fora do intervalo
namedItem( id ) Retorna o <area> elemento da coleção com o especificado id.

Nota: Retorna null se o id não existe

Detalhes técnicos

DOM Versão: Núcleo Nível Objeto 2 Documento
Valor de retorno: Um objeto HTMLCollection, representando todos <area> elementos em uma imagem-mapa no documento. Os elementos na coleção são classificadas como eles aparecem no código fonte
Exemplos

mais Exemplos

Exemplo

[Índice]

Obter o URL da primeira <area> elemento de uma imagem-mapa:

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

O resultado x será:

http://www.w3ii.com/jsref/sun.htm
Tente você mesmo "

Exemplo

item( index )

Obter o URL da primeira <area> elemento de uma imagem-mapa:

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

O resultado x será:

http://www.w3ii.com/jsref/sun.htm
Tente você mesmo "

Exemplo

namedItem( id )

Obter o URL do <area> elemento com id = "myArea" em uma imagem-mapa:

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

O resultado x será:

http://www.w3ii.com/jsref/mercur.htm
Tente você mesmo "

Exemplo

Percorrer todos <area> elementos em uma imagem-mapa e de saída a forma de cada área:

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

O resultado do txt será:

rect
circle
circle
Tente você mesmo "
<Mapa Objeto