JavaScript HTML DOM Dokument

Das HTML DOM Dokument-Objekt ist der Besitzer aller anderen Objekte auf Ihrer Webseite.

HTML DOM Document-Objekt

Das Dokument-Objekt repräsentiert Ihre Webseite.

Wenn Sie auf ein Element einer HTML-Seite zugreifen möchten, beginnen Sie immer mit dem Zugriff auf das Document-Objekt.

Hier sind einige Beispiele, wie Sie den Document-Objekt verwenden können, um auf und HTML zu zugreifen und zu manipulieren.

Finden Sie HTML-Elemente

Method Description
document.getElementById(id) Finden Sie Elemente durch den Element-ID
document.getElementsByTagName(Name) Finden Sie Elemente durch Tagsnamen
document.getElementsByClassName(Name) Finden Sie Elemente durch Klassennamen

Ändern Sie ein HTML-Element

Method Description
element.innerHTML = Neuer HTML-Inhalt Ändern Sie den inneren HTML eines Elements
element.attribute = new value Change the attribute value of the HTML element
element.setAttribute(attribute, value) Change the attribute value of the HTML element
element.style.property = new style Change the style of the HTML element

Add and delete elements

Method Description
document.createElement(element) Create HTML element
document.removeChild(element) Delete HTML element
document.appendChild(element) Add HTML element
document.replaceChild(element) Replace HTML element
document.write(text) Write to HTML output stream

Add event handler

Method Description
document.getElementById(id).onclick = function(){code} Add an event handler to the onclick event

Find HTML objects

First HTML DOM Level 1 (1998) defined 11 HTML objects, object collections, and properties. They are still valid in HTML5.

Later, in HTML DOM Level 3, more objects, collections, and properties were added.

Properties Description DOM
document.anchors Return all <a> elements with the name attribute. 1
document.applets Return all <applet> elements(Not recommended in HTML5) 1
document.baseURI Return the absolute base URI of the document 3
document.body Return the <body> element 1
document.cookie Return the cookie of the document 1
document.doctype Return the doctype of the document 3
document.documentElement Return the <html> element 3
document.documentMode Return the mode used by the browser 3
document.documentURI Return the URI of the document 3
document.domain Return the domain name of the document server 1
document.domConfig Abandoned.Return the DOM configuration 3
document.embeds Return all <embed> elements 3
document.forms Gibt alle <form>-Elemente zurück 1
document.head Gibt das <head>-Element zurück 3
document.images Gibt alle <img>-Elemente zurück 1
document.implementation Gibt die DOM-Implementierung zurück 3
document.inputEncoding Gibt die Zeichensatzkodierung (Zeichensatz) des Dokuments zurück 3
document.lastModified Gibt das Datum und die Uhrzeit der Aktualisierung des Dokuments zurück 3
document.links Gibt alle <area> und <a>-Elemente mit dem href-Attribut zurück 1
document.readyState Gibt den (Lade-)Status des Dokuments zurück 3
document.referrer Gibt den referenzierten URI (verknüpfte Dokumente) zurück 1
document.scripts Gibt alle <script>-Elemente zurück 3
document.strictErrorChecking Gibt zurück, ob Fehlerprüfungen durchgesetzt werden 3
document.title Gibt das <title>-Element zurück 1
document.URL Gibt die vollständige URL des Dokuments zurück 1