Lesson 01 · The DOM
The DOM: Selecting & Traversing the Live Document
What the DOM actually is, how the browser turns markup into a live tree of nodes, and how to select into it, read it safely, and walk it - the place where JavaScript meets the page.
Prerequisites: JavaScript functions & control flow · HTML document structure
Learning objectives
By the end of this lesson, you will be able to:
- Explain how the browser turns HTML into a tree of nodes
- Select elements with querySelector and querySelectorAll
- Choose the right selector - id, class or attribute - for the job
- Read and write element text safely with textContent
- Walk the tree with parentElement, children and closest
- Check selection results for null before touching them