tutorial pengembangan web terbaru
 

HTML DOM gambar Koleksi

<Document Object

Contoh

Cari tahu berapa banyak <img> elemen ada dalam dokumen:

var x = document.images.length;

Hasil x akan:

3
Cobalah sendiri "

Lebih "Try it Yourself" contoh di bawah ini.


Definisi dan Penggunaan

Gambar koleksi mengembalikan koleksi semua <img> elemen dalam dokumen.

Note: Elemen-elemen dalam koleksi diurutkan seperti yang muncul dalam kode sumber.

Catatan: Gambar-gambar koleksi tidak kembali koleksi <input> elemen dengan type = "image".

Tip: Juga melihat Gambar Object .


Dukungan Browser

Koleksi
images iya nih iya nih iya nih iya nih iya nih

Sintaksis

document.images

properti

Milik Deskripsi
length Mengembalikan jumlah <img> elemen dalam koleksi.

Catatan: Properti ini read-only

metode

metode Deskripsi
[ index ] Mengembalikan <img> elemen dari koleksi dengan indeks tertentu (starts at 0) .

Catatan: Mengembalikan null jika jumlah indeks berada di luar jangkauan
item( index ) Mengembalikan <img> elemen dari koleksi dengan indeks tertentu (starts at 0) .

Catatan: Mengembalikan null jika jumlah indeks berada di luar jangkauan
namedItem( id ) Mengembalikan <img> elemen dari koleksi dengan id tertentu.

Catatan: Mengembalikan null jika id tidak ada

Rincian teknis

DOM Versi: Inti Level 1 Document Object
Kembali Nilai: Sebuah HTMLCollection Object, yang mewakili semua <img> elemen dalam dokumen. Unsur-unsur dalam koleksi diurutkan seperti yang muncul dalam kode sumber

contoh

Contoh lebih

Contoh

[Index]

Dapatkan URL pertama <img> elemen (index 0) dalam dokumen:

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

Hasil x akan:

http://www.w3ii.com/jsref/klematis.jpg
Cobalah sendiri "

Contoh

item( index )

Dapatkan URL pertama <img> elemen (index 0) dalam dokumen:

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

Hasil x akan:

http://www.w3ii.com/jsref/klematis.jpg
Cobalah sendiri "

Contoh

namedItem( id )

Dapatkan URL <img> elemen dengan id = "myImg" dalam dokumen:

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

Hasil x akan:

http://www.w3ii.com/jsref/smiley.gif
Cobalah sendiri "

Contoh

Menambahkan perbatasan bertitik hitam untuk pertama <img> elemen dalam dokumen:

document.images[0].style.border = "10px dotted black";
Cobalah sendiri "

Contoh

Loop melalui semua <img> elemen dalam dokumen, dan output URL (src) dari masing-masing gambar:

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

Hasil txt akan:

http://www.w3ii.com/jsref/klematis.jpg
http://www.w3ii.com/jsref/klematis2.jpg
http://www.w3ii.com/jsref/smiley.gif
Cobalah sendiri "

Pages terkait

Referensi JavaScript: HTML DOM Gambar Obyek

HTML tutorial: Gambar HTML

Referensi HTML: HTML <img> tag


<Document Object