JavaScript DOM-zelfstudie met voorbeeld

Inhoudsopgave:

Anonim

Wat is DOM in JavaScript?

JavaScript heeft toegang tot alle elementen op een webpagina door gebruik te maken van Document Object Model (DOM). In feite maakt de webbrowser een DOM van de webpagina aan wanneer de pagina wordt geladen. Het DOM-model is als volgt gemaakt als een boom van objecten:

DOM en evenementen gebruiken

Met DOM kan JavaScript meerdere taken uitvoeren. Het kan nieuwe elementen en attributen maken, de bestaande elementen en attributen wijzigen en zelfs bestaande elementen en attributen verwijderen. JavaScript kan ook reageren op bestaande evenementen en nieuwe evenementen op de pagina maken.

getElementById, innerHTML Voorbeeld

  1. getElementById: om toegang te krijgen tot elementen en attributen waarvan het id is ingesteld.
  2. innerHTML: om toegang te krijgen tot de inhoud van een element.

Probeer dit voorbeeld zelf:

 DOM !!! 

Welkom

Dit is het welkomstbericht.

Technologie

Dit is het technologiegedeelte.

Voorbeeld van event handler

  1. createElement: om een ​​nieuw element te maken
  2. removeChild: Verwijder een element
  3. U kunt als volgt een gebeurtenishandler aan een bepaald element toevoegen:
 document.getElementById(id).onclick=function(){lines of code to be executed}

OF

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

Probeer dit voorbeeld zelf:

 DOM !!!