JavaScript DOM-dokument

Indholdsfortegnelse

    Vis indholdsfortegnelse

HTML DOM dokumentobjektet er ejeren af alle andre objekter på din webside.

HTML DOM-dokumentobjektet

Dokumentobjektet repræsenterer din webside.

Hvis du vil have adgang til et hvilket som helst element på en HTML-side, starter du altid med at få adgang til dokumentobjekt.

Nedenfor er nogle eksempler på, hvordan du kan bruge dokumentobjektet til at tilgå og manipulere HTML.

Find HTML-elementer

document.getElementById(id)

Find et element efter element-id

document.getElementsByTagName(name)

Find elementer efter tagnavn

document.getElementsByClassName(name)

Find elementer efter klassenavn

Ændring af HTML-elementer

element.innerHTML =  new html content

Skift den indre HTML af et element

element.attribute = new value

Ændre attributværdien for et HTML-element

element.style.property = new style

Skift stilen på et HTML-element

element.setAttribute(attribute, value)

Ændre attributværdien for et HTML-element

Tilføjelse og sletning af elementer

document.createElement(element)

Opret et HTML-element

document.removeChild(element)

Fjern et HTML-element

document.appendChild(element)

Tilføj et HTML-element

document.replaceChild(new, old)

Erstat et HTML-element

document.write(text)

Skriv ind i HTML-outputstrømmen

Tilføjelse af hændelseshåndtere

document.getElementById(id).onclick = function(){code}

Tilføjelse af hændelseshåndteringskode til en onclick-hændelse

Find HTML-objekter

Den første HTML DOM Level 1 (1998) definerede 11 HTML-objekter, objektsamlinger og egenskaber. Disse er stadig gyldige i HTML5.

Senere, i HTML DOM Level 3, blev flere objekter, samlinger og egenskaber tilføjet.

document.anchors

Returnerer alle <a>-elementer, der har en navneattribut. Niveau 1

document.applets

Udgået. Niveau 1

document.baseURI

Returnerer dokumentets absolutte basis-URI. Niveau: 3

document.body

Returnerer elementet <body>. Niveau 1

document.cookie

Returnerer dokumentets cookie. Niveau 1

document.doctype

Returnerer dokumentets doctype. Niveau: 3

document.documentElement

Returnerer <html>-elementet. Niveau: 3

document.documentMode

Returnerer den tilstand, der bruges af browseren. Niveau: 3

document.documentURI

Returnerer dokumentets URI. Niveau: 3

document.domain

Returnerer domænenavnet på dokumentserveren. Niveau 1

document.domConfig

Forældet.. Niveau: 3

document.embeds

Returnerer alle <embed>-elementer. Niveau: 3

document.forms

Returnerer alle <form>-elementer. Niveau 1

document.head

Returnerer elementet <head>. Niveau: 3

document.images

Returnerer alle <img>-elementer. Niveau 1

document.implementation

Returnerer DOM-implementeringen. Niveau: 3

document.inputEncoding

Returnerer dokumentets kodning (tegnsæt). Niveau: 3

document.lastModified

Returnerer datoen og klokkeslættet, da dokumentet blev opdateret. Niveau: 3

document.links

Returnerer alle <area>- og <a>-elementer, der har en href-attribut. Niveau 1

document.readyState

Returnerer (indlæser) status for dokumentet. Niveau: 3

document.referrer

Returnerer referentens URI (linkningsdokumentet). Niveau 1

document.scripts

Returnerer alle <script>-elementer. Niveau: 3

document.strictErrorChecking

Returnerer, hvis fejlkontrol håndhæves. Niveau: 3

document.title

Returnerer <title>-elementet. Niveau 1

document.URL

Returnerer den komplette URL for dokumentet. Niveau 1