JavaScript DOM-tutorial med eksempel

Indholdsfortegnelse:

Anonim

Hvad er DOM i JavaScript?

JavaScript kan få adgang til alle elementerne på en webside ved hjælp af Document Object Model (DOM). Faktisk opretter webbrowseren en DOM på websiden, når siden indlæses. DOM-modellen er oprettet som et træ af objekter som dette:

Sådan bruges DOM og begivenheder

Ved hjælp af DOM kan JavaScript udføre flere opgaver. Det kan oprette nye elementer og attributter, ændre de eksisterende elementer og attributter og endda fjerne eksisterende elementer og attributter. JavaScript kan også reagere på eksisterende begivenheder og oprette nye begivenheder på siden.

getElementById, innerHTML Eksempel

  1. getElementById: For at få adgang til elementer og attributter, hvis id er indstillet.
  2. innerHTML: For at få adgang til indholdet af et element.

Prøv dette eksempel selv:

 DOM !!! 

Velkommen


Dette er velkomstmeddelelsen.



Teknologi


Dette er teknologisektionen.

Eksempel på begivenhedshåndterer

  1. createElement: For at oprette nyt element
  2. removeChild: Fjern et element
  3. Du kan tilføje en begivenhedshåndterer til et bestemt element som dette:
 document.getElementById(id).onclick=function(){lines of code to be executed}

ELLER

document.getElementById(id).addEventListener("click", functionname)

Prøv dette eksempel selv:

 DOM !!!