Obiectul document HTML DOM este proprietarul tuturor celorlalte obiecte din pagina web.
Obiectul HTML DOM Document
Obiectul documentului reprezinta pagina web.
Dacă doriți să accesați orice element într-o pagină HTML, întotdeauna începe cu accesarea obiectului documentului.
Mai jos sunt câteva exemple de modul în care puteți utiliza obiectul document pentru a accesa și manipula HTML.
Găsirea elementelor HTML
| Metodă | Descriere |
|---|---|
| document. getElementById( id ) | Găsiți un element cu element id |
| document. getElementsByTagName( name ) | Găsiți elemente după nume etichetă |
| document. getElementsByClassName( name ) | Găsiți elemente după numele clasei |
Schimbarea Elemente HTML
| Metodă | Descriere |
|---|---|
| element .innerHTML = new html content | Schimbarea HTML interior al unui element |
| element . attribute = new value | Modificarea valorii atribut al unui element HTML |
| element .setAttribute (attribute, value) | Modificarea valorii atribut al unui element HTML |
| element .style. property = new style | Schimbarea stilul unui element HTML |
Adăugarea și ștergerea elementelor
| Metodă | Descriere |
|---|---|
| document. createElement( element ) | Crearea unui element HTML |
| document. removeChild( element ) | Eliminarea unui element HTML |
| document. appendChild( element ) | Adăugați un element HTML |
| document. replaceChild( element ) | Înlocuiți un element HTML |
| document. write( text ) | Scrieți în fluxul de ieșire HTML |
Adăugarea Evenimente Handlere
| Metodă | Descriere |
|---|---|
| document. getElementById( id ) .onclick = function() { code } | Adăugarea de cod de tratare a evenimentului la un onclick eveniment |
Găsirea obiecte HTML
Primul HTML DOM Level 1 (1998) , definit obiecte 11 HTML, colecții de obiecte și proprietăți. Acestea sunt încă valabile în HTML5.
Mai târziu, în HTML DOM Level 3, au fost adăugate mai multe obiecte, colecții și proprietăți.
| Proprietate | Descriere | DOM |
|---|---|---|
| document.anchors | Returnează toate <a> elementele care au un atribut nume | 1 |
| document.applets | Returnează toate <applet> elemente (Depreciată în HTML5) | 1 |
| document.baseURI | Returnează URI-ul de bază absolută a documentului | 3 |
| document.body | Returnează <body> elementul | 1 |
| document.cookie | Returnează cookie documentului | 1 |
| document.doctype | Returnează DOCTYPE documentului | 3 |
| document.documentElement | Returnează <html> elementul | 3 |
| document.documentMode | Returnează modul utilizat de browser | 3 |
| document.documentURI | Returnează URI-ul documentului | 3 |
| document.domain | Returnează numele de domeniu al serverului de documente | 1 |
| document.domConfig | Perimate. Returnează configurația DOM | 3 |
| document.embeds | Returnează toate <embed> elemente | 3 |
| document.forms | Returnează toate <form> elemente | 1 |
| document.head | Returnează <head> Elementul | 3 |
| document.images | Returnează toate <img> Elemente | 1 |
| document.implementation | Returnează punerea în aplicare DOM | 3 |
| document.inputEncoding | Returnează codificarea documentului (character set) de (character set) | 3 |
| document.lastModified | Returnează data și ora la care documentul a fost actualizat | 3 |
| document.links | Returnează toate <area> si <a> elemente care au un atribut href | 1 |
| document.readyState | Returnează (loading) statutul documentului | 3 |
| document.referrer | Returnează URI referrer (the linking document) de (the linking document) | 1 |
| document.scripts | Returnează toate <script> elemente | 3 |
| document.strictErrorChecking | Returnează dacă verificarea erorilor este executată | 3 |
| document.title | Returnează <title> elementul | 1 |
| document.URL | Returnează adresa URL completă a documentului | 1 |