JavaScript HTML DOM

Attraverso l'HTML DOM, JavaScript può accedere e modificare tutti gli elementi del documento HTML.

HTML DOM (Modello Oggettuale del Documento)

Quando la pagina web viene caricata, il browser crea il modello oggettuale del documento della pagina (Document Object Model).

HTML DOM Il modello è strutturato comeAlbero degli oggetti:

Albero DOM degli oggetti

Albero DOM HTML

Attraverso questo modello oggettuale, JavaScript ottiene tutte le forze necessarie per creare HTML dinamico:

  • JavaScript può modificare tutti gli elementi HTML nella pagina
  • JavaScript può modificare tutti gli attributi HTML nella pagina
  • JavaScript può modificare tutti gli stili CSS nella pagina
  • JavaScript può eliminare gli elementi HTML e gli attributi esistenti
  • JavaScript può aggiungere nuovi elementi HTML e attributi
  • JavaScript può reagire a tutti gli eventi HTML esistenti nella pagina
  • JavaScript può creare nuovi eventi HTML nella pagina

Cosa imparerai

Nelle sezioni seguenti di questa guida, imparerai:

  • Come modificare il contenuto degli elementi HTML
  • Come modificare lo stile degli elementi HTML (CSS)
  • Come rispondere agli eventi HTML DOM
  • Come aggiungere e eliminare gli elementi HTML

Cos'è DOM?

DOM è uno standard W3C (World Wide Web Consortium).

DOM definisce gli standard di accesso ai documenti:

“Il Document Object Model (DOM) W3C è un'interfaccia piattaforma e linguaggio neutra che permette a programmi e script di accedere, aggiornare e modificare il contenuto, la struttura e lo stile dei documenti in modo dinamico.”

Lo standard W3C DOM è diviso in 3 parti diverse:

  • Core DOM - Modello standard per tutti i tipi di documenti
  • XML DOM - Modello standard del documento XML
  • HTML DOM - Modello standard del documento HTML

Cos'è HTML DOM?

HTML DOM è lo standard dell'HTMLOggettoe modelliInterfaccia di programmazione. Definisce:

  • comeOggettodegli elementi HTML
  • di tutti gli elementi HTMLProprietà
  • Accedere a tutti gli elementi HTMLMetodi
  • di tutti gli elementi HTMLEventi

In altre parole: HTML DOM è lo standard per ottenere, modificare, aggiungere o eliminare gli elementi HTML.