JavaScript DOM-handledning med exempel

Innehållsförteckning:

Anonim

Vad är DOM i JavaScript?

JavaScript kan komma åt alla element på en webbsida med hjälp av Document Object Model (DOM). I själva verket skapar webbläsaren en DOM på webbsidan när sidan laddas. DOM-modellen skapas som ett träd av objekt så här:

Hur man använder DOM och händelser

Med DOM kan JavaScript utföra flera uppgifter. Det kan skapa nya element och attribut, ändra befintliga element och attribut och till och med ta bort befintliga element och attribut. JavaScript kan också reagera på befintliga händelser och skapa nya händelser på sidan.

getElementById, innerHTML Exempel

  1. getElementById: För att komma åt element och attribut vars ID är inställt.
  2. innerHTML: För att komma åt innehållet i ett element.

Prova detta exempel själv:

 DOM !!! 

Välkommen


Detta är välkomstmeddelandet.



Teknik


Detta är teknikavsnittet.

Exempel på händelsehanterare

  1. createElement: Skapa nytt element
  2. removeChild: Ta bort ett element
  3. Du kan lägga till en händelsehanterare till ett visst element så här:
 document.getElementById(id).onclick=function(){lines of code to be executed}

ELLER

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

Prova detta exempel själv:

 DOM !!!