JS TutorialLesson 33Free preview

JS HTML DOM

This lesson is part of JavaScript · All levels

Summary

A document object model (DOM) is a tree representing the objects of all HTML elements that can be read and modified by JavaScript. Through the document object we can select elements with getElementById or querySelector, and then change the text, attributes, or style. DOM manipulation is at the heart of every interaction on a web page, from displaying data to creating single-page applications.

Key points

DOM represents HTML as a tree of related objects
GetElementById selects based on id, querySelector uses any CSS selector
TextContent changes the raw text, innerHTML translates the markup HTML
Style and setAttribute changes the look and attributes of the elements

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.