Dokument JavaScript HTML DOM

Obiekt dokumentu HTML DOM jest właścicielem wszystkich innych obiektów w Twojej stronie internetowej.

Obiekt Document HTML DOM

Obiekt dokumentu reprezentuje Twoją stronę internetową.

Jeśli chcesz uzyskać dostęp do jakiegokolwiek elementu na stronie HTML, zawsze zaczynaj od dostępu do obiektu document.

Poniżej znajdują się przykłady, jak używać obiektu document do dostępu i operacji na HTML.

Znajdowanie elementów HTML

Metoda Opis
document.getElementById(id) Znajdowanie elementów za pomocą identyfikatora elementu
document.getElementsByTagName(name) Znajdowanie elementów za pomocą nazwy tagu
document.getElementsByClassName(name) Znajdowanie elementów za pomocą nazwy klasy

Zmiana elementu HTML

Metoda Opis
element.innerHTML = nowy zawartość HTML Zmiana wewnętrznego HTML elementu
element.attribute = new value Zmiana wartości atrybutu elementu HTML
element.setAttribute(attribute, value) Zmiana wartości atrybutu elementu HTML
element.style.property = new style Zmiana stylu elementu HTML

Dodawanie i usuwanie elementów

Metoda Opis
document.createElement(element) Tworzenie elementu HTML
document.removeChild(element) Usuwanie elementu HTML
document.appendChild(element) Dodawanie elementu HTML
document.replaceChild(element) Zastępowanie elementu HTML
document.write(text) Zapis do strumienia wyjściowego HTML

Dodawanie programistów

Metoda Opis
document.getElementById(id).onclick = function(){code} Dodawanie programistów do zdarzenia onclick

Znajdowanie obiektów HTML

Pierwszy HTML DOM Level 1 (1998), zdefiniował 11 obiektów HTML, kolekcji obiektów i atrybutów. Są one nadal ważne w HTML5.

Później, w HTML DOM Level 3, dodano więcej obiektów, kolekcji i atrybutów.

Atrybuty Opis DOM
document.anchors Zwraca wszystkie elementy <a> posiadające atrybut name. 1
document.applets Zwraca wszystkie elementy <applet>(Nie zalecane w HTML5) 1
document.baseURI Zwraca absolutną bazową URI dokumentu 3
document.body Zwraca element <body> 1
document.cookie Zwraca plik cookie dokumentu 1
document.doctype Zwraca doctype dokumentu 3
document.documentElement Zwraca element <html> 3
document.documentMode Zwraca tryb używany przez przeglądarkę 3
document.documentURI Zwraca URI dokumentu 3
document.domain Zwraca domenę serwera dokumentu 1
document.domConfig Przestarzałe.Zwraca konfigurację DOM 3
document.embeds Zwraca wszystkie elementy <embed> 3
document.forms Zwraca wszystkie elementy <form> 1
document.head Zwraca element <head> 3
document.images Zwraca wszystkie elementy <img> 1
document.implementation Zwraca implementację DOM 3
document.inputEncoding Zwraca kodowanie dokumentu (zestaw znaków) 3
document.lastModified Zwraca datę i czas aktualizacji dokumentu 3
document.links Zwraca wszystkie elementy <area> i <a> z atrybutem href 1
document.readyState Zwraca stan dokumentu (ładowanie) 3
document.referrer Zwraca odniesienie URI (link dokumentu) 1
document.scripts Zwraca wszystkie elementy <script> 3
document.strictErrorChecking Zwraca, czy wykonywanie błędów jest wymuszone 3
document.title Zwraca element <title> 1
document.URL Zwraca pełny URL dokumentu 1