tutoriais mais recente desenvolvimento web
 

HTML DOM Coleção imagens

<Document Object

Exemplo

Descubra quantas <img> elementos existem no documento:

var x = document.images.length;

O resultado x será:

3
Tente você mesmo "

Mais "Try it Yourself" exemplos abaixo.


Definição e Uso

A coleção de imagens retorna uma coleção de todos os <img> elementos no documento.

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

Nota: A coleção de imagens não retorna uma coleção de <input> elementos type = "imagem" com.

Dica: Também olhar para a imagem do objeto .


Suporte navegador

Coleção
images sim sim sim sim sim

Sintaxe

document.images

propriedades

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

Nota: Esta propriedade é somente leitura

Métodos

Método Descrição
[ index ] Retorna o <img> 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 <img> 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 <img> 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 1 Documento
Valor de retorno: Um objeto HTMLCollection, representando todos <img> elementos 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 <img> elemento (index 0) no documento:

var x = document.images[0].src;

O resultado x será:

http://www.w3ii.com/jsref/klematis.jpg
Tente você mesmo "

Exemplo

item( index )

Obter o URL da primeira <img> elemento (index 0) no documento:

var x = document.images.item(0).src;

O resultado x será:

http://www.w3ii.com/jsref/klematis.jpg
Tente você mesmo "

Exemplo

namedItem( id )

Obter o URL do <img> elemento com id = "MyIMG" no documento:

var x = document.images.namedItem("myImg").src;

O resultado x será:

http://www.w3ii.com/jsref/smiley.gif
Tente você mesmo "

Exemplo

Adicionar uma borda preta pontilhada à primeira <img> elemento no documento:

document.images[0].style.border = "10px dotted black";
Tente você mesmo "

Exemplo

Percorrer todos <img> elementos no documento, ea saída do URL (src) de cada imagem:

var x = document.images;
var txt = "";
var i;
for (i = 0; i < x.length; i++) {
    txt = txt + x[i].src + "<br>";
}

O resultado do txt será:

http://www.w3ii.com/jsref/klematis.jpg
http://www.w3ii.com/jsref/klematis2.jpg
http://www.w3ii.com/jsref/smiley.gif
Tente você mesmo "

Páginas relacionadas

JavaScript referência: HTML DOM objeto Imagem

Tutorial HTML: HTML Imagens

Referência HTML: HTML <img> tag


<Document Object