Tutorial DOM JavaScript con esempio

Sommario:

Anonim

Cos'è DOM in JavaScript?

JavaScript può accedere a tutti gli elementi in una pagina web facendo uso di Document Object Model (DOM). Infatti, il browser web crea un DOM della pagina web quando la pagina viene caricata. Il modello DOM viene creato come un albero di oggetti come questo:

Come utilizzare DOM ed eventi

Utilizzando DOM, JavaScript può eseguire più attività. Può creare nuovi elementi e attributi, modificare gli elementi e gli attributi esistenti e persino rimuovere elementi e attributi esistenti. JavaScript può anche reagire a eventi esistenti e creare nuovi eventi nella pagina.

getElementById, innerHTML Example

  1. getElementById: per accedere a elementi e attributi il ​​cui ID è impostato.
  2. innerHTML: per accedere al contenuto di un elemento.

Prova tu stesso questo esempio:

 DOM !!! 

Benvenuto


Questo è il messaggio di benvenuto.



Tecnologia


Questa è la sezione della tecnologia.

Esempio di gestore di eventi

  1. createElement: per creare un nuovo elemento
  2. removeChild: rimuove un elemento
  3. Puoi aggiungere un gestore di eventi a un elemento particolare come questo:
 document.getElementById(id).onclick=function(){lines of code to be executed}

O

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

Prova tu stesso questo esempio:

 DOM !!!