DOM — estrutura, seleção e manipulação

Galho 1 da trilha Plataforma Web. Cobre o Document Object Model: como o browser representa o documento em memória, como JavaScript seleciona e manipula nós, e como otimizar essas operações.

Fase Iniciado

• 01 — O DOM como árvore — o que é o DOM, tipos de nó, window/document, live vs static
• 02 — Seleção de elementos — querySelector, getElementById, closest, matches
• 03 — Traversal — parentElement, children, firstElementChild, contains

Fase Adepto

• 04 — Manipulação de DOM — createElement, append, innerHTML vs textContent, XSS
• 05 — Atributos, propriedades e dataset — getAttribute vs propriedades, classList, dataset
• 06 — DocumentFragment e batch mutations — reflow, fragment, layout thrashing

Fase Magus

• 07 — template e cloneNode — template nativo, Web Components, Shadow DOM
• 08 — DOM em entrevista — Virtual DOM vs real, reflow, armadilhas, capstone

Próximo galho

G2 — Eventos — event model, propagação, delegation, custom events