Prep: The Document Object Model

Session goals

By the end of this session students will be able to do the following:

• Use the Document Object Model to read and modify an HTML page with JavaScript
• Combine JS objects, functions, and rendered HTML in a single application

Videos and readings

Please set aside time to watch the following priority video tutorial before class, up to 1:04.

If you learn best by reading, check out the assigned chapter of the online textbook Eloquent JavaScript.

Priority

Watch up to 1:04, through the “Working with Attributes” section, stopping before the “Events” section. JavaScript DOM Manipulation Mastery: A Comprehensive Guide, 1h 25m, Envato Tuts (Jeremy McPeak), YouTube, 11 Jul 2023.

JavaScript Modules with Import/Export Syntax (ES6), 12m 37s, dcode, YouTube, 9 July 2019.

The Document Object Model, chapter from book Eloquent JavaScript, 3rd ed. (2018), Marijn Haverbeke

Also recommended

Watch the rest of the above DOM video tutorial, including “Events” and “Using Event Delegation...”