JavaScript and the DOM

Overview

Use JavaScript and the DOM to create, update, and delete page content, style elements, respond to browser events, and measure reflow, repaint, and event loop performance.

Syllabus

The Document Object Model

The Document Object Model (DOM) allows developers to interact with and control the rendered page. You'll learn how the DOM is formed, what Nodes and Elements are, and how to select items from the DOM.

Creating Content with JavaScript

Static is boring, so we'll use JavaScript and DOM methods to create new page content, update existing content, and delete content. You'll also learn how to check and set the styling of page elements.

Working with Browser Events

Hundreds of events fire every time you interact with a page. Learn what an event is, how to listen for an event and respond to it, what data is included with an event, and the phases of an event.

Performance

Learn how to measure the code you write to make sure it's performing efficiently and how reflow and repaint affect performance. Learn how to harness the JavaScript Event loop for performance gains.