JavaScript DOM Tutorial med eksempel

Innholdsfortegnelse:

Anonim

Hva er DOM i JavaScript?

JavaScript har tilgang til alle elementene på en webside ved hjelp av Document Object Model (DOM). Nettleseren oppretter faktisk en DOM på websiden når siden lastes inn. DOM-modellen er opprettet som et tre av gjenstander som dette:

Hvordan bruke DOM og hendelser

Ved hjelp av DOM kan JavaScript utføre flere oppgaver. Det kan opprette nye elementer og attributter, endre eksisterende elementer og attributter og til og med fjerne eksisterende elementer og attributter. JavaScript kan også reagere på eksisterende hendelser og opprette nye hendelser på siden.

getElementById, innerHTML Eksempel

  1. getElementById: Å få tilgang til elementer og attributter hvis ID er angitt.
  2. innerHTML: Å få tilgang til innholdet i et element.

Prøv dette eksemplet selv:

 DOM !!! 

Velkommen


Dette er velkomstmeldingen.



Teknologi


Dette er teknologidelen.

Eksempel på hendelsesbehandler

  1. createElement: Å lage et nytt element
  2. removeChild: Fjern et element
  3. Du kan legge til en hendelsesbehandler 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 eksemplet selv:

 DOM !!!