Please enable JavaScript.
Coggle requires JavaScript to display documents.
L'Oggetto Document e il DOM - Coggle Diagram
L'Oggetto Document e il DOM
Fondamenti del DOM
Concetto di DOM: Definizione del Document Object Model come interfaccia per il controllo della pagina.
Rappresentazione Grafica: Visualizzazione della struttura ad albero dei nodi.
Selezione degli Elementi
Selezione Singola: Individuazione di elementi specifici tramite getElementById() e querySelector().
Selezione Multipla: Recupero di gruppi di elementi con getElementsByClassName(), getElementsByTagName() e querySelectorAll().
Modifica del Contenuto
Contenuto HTML: Utilizzo di innerHTML per inserire o modificare codice markup all'interno degli elementi.
Contenuto Testuale: Uso di innerText e textContent per manipolare esclusivamente il testo visibile.
Attributi e Stili
Metodi per gli Attributi: Gestione delle proprietà dei tag tramite getAttribute(), setAttribute() e removeAttribute().
Modifica Stili CSS: Manipolazione dinamica dell'aspetto visivo tramite la proprietà style.
Manipolazione della Struttura (Nodi)
Creazione e Inserimento: Generazione di nuovi nodi con createElement() e posizionamento con appendChild().
Rimozione: Eliminazione di elementi dalla pagina tramite removeChild(), remove() o remove().
Navigazione nel DOM: Spostamento tra i nodi utilizzando parentNode, childNodes, firstChild, lastChild e nextSibling.
Attività Didattiche e Laboratorio
Esercitazione Guidata: Pratica iniziale sulla selezione e modifica dei nodi (40 min).
Laboratorio Dinamico: Creazione via codice di liste e tabelle (60 min).
Progetto Applicativo: Sviluppo di una To-do list interattiva completa (90 min).
Workshop di Integrazione: Consolidamento finale di tutte le competenze JavaScript acquisite (60 min).
Risorse e Valutazione
Materiali Digitali: Supporto tramite mappa concettuale del DOM e video tutorial dedicato (18 min).
Verifica: Quiz finale di 20 domande per la valutazione delle competenze.