HTML DOM dokumen objek adalah pemilik semua benda-benda lain di halaman web Anda.
Dokumen DOM HTML Object
Objek dokumen merupakan halaman web Anda.
Jika Anda ingin mengakses setiap elemen dalam halaman HTML, Anda selalu mulai dengan mengakses objek dokumen.
Berikut adalah beberapa contoh bagaimana Anda dapat menggunakan objek dokumen untuk mengakses dan memanipulasi HTML.
Temuan HTML Elements
| metode | Deskripsi |
|---|---|
| document.getElementById( id ) | Menemukan elemen dengan elemen id |
| document.getElementsByTagName( name ) | Cari unsur menurut nama tag |
| document.getElementsByClassName( name ) | Menemukan unsur-unsur dengan nama kelas |
Mengubah HTML Elements
| metode | Deskripsi |
|---|---|
| element .innerHTML = new html content | Mengubah HTML batin elemen |
| element . attribute = new value | Mengubah nilai atribut dari elemen HTML |
| element .setAttribute (attribute, value) | Mengubah nilai atribut dari elemen HTML |
| element .style. property = new style | Mengubah gaya elemen HTML |
Menambah dan Menghapus Elemen
| metode | Deskripsi |
|---|---|
| document.createElement( element ) | Buat sebuah elemen HTML |
| document.removeChild( element ) | Menghapus sebuah elemen HTML |
| document.appendChild( element ) | Menambahkan elemen HTML |
| document.replaceChild( element ) | Ganti elemen HTML |
| document.write( text ) | Menulis ke output stream HTML |
Menambahkan Acara Penangan
| metode | Deskripsi |
|---|---|
| document.getElementById( id ).onclick = function(){ code } | Menambahkan kode event handler untuk sebuah onclick event |
Menemukan Objek HTML
HTML pertama DOM Level 1 (1998), mendefinisikan objek 11 HTML, koleksi objek, dan properti. Ini masih berlaku di HTML5.
Kemudian, di HTML DOM Level 3, lebih objek, koleksi, dan properti ditambahkan.
| Milik | Deskripsi | DOM |
|---|---|---|
| document.anchors | Mengembalikan semua <a> elemen yang memiliki atribut nama | 1 |
| document.applets | Mengembalikan semua <applet> elemen (berlaku lagi di HTML5) | 1 |
| document.baseURI | Mengembalikan URI dasar mutlak dokumen | 3 |
| document.body | Mengembalikan <body> elemen | 1 |
| document.cookie | Mengembalikan cookie dokumen | 1 |
| document.doctype | Mengembalikan doctype dokumen ini | 3 |
| document.documentElement | Mengembalikan <html> elemen | 3 |
| document.documentMode | Mengembalikan modus yang digunakan oleh browser | 3 |
| document.documentURI | Mengembalikan URI dokumen | 3 |
| document.domain | Mengembalikan nama domain dari server dokumen | 1 |
| document.domConfig | Usang. Mengembalikan konfigurasi DOM | 3 |
| document.embeds | Mengembalikan semua <embed> elemen | 3 |
| document.forms | Mengembalikan semua <form> elemen | 1 |
| document.head | Mengembalikan <head> elemen | 3 |
| document.images | Mengembalikan semua <img> elemen | 1 |
| document.implementation | Mengembalikan pelaksanaan DOM | 3 |
| document.inputEncoding | Mengembalikan encoding dokumen ini (set karakter) | 3 |
| document.lastModified | Mengembalikan tanggal dan waktu dokumen itu diperbarui | 3 |
| document.links | Pengembalian semua <area> dan <a> elemen yang memiliki atribut href | 1 |
| document.readyState | Mengembalikan (loading) status dokumen | 3 |
| document.referrer | Mengembalikan URI dari pengarah (dokumen menghubungkan) | 1 |
| document.scripts | Mengembalikan semua <script> elemen | 3 |
| document.strictErrorChecking | Pengembalian jika pengecekan error ditegakkan | 3 |
| document.title | Mengembalikan <title> elemen | 1 |
| document.URL | Mengembalikan URL lengkap dokumen | 1 |