Book
Submodule 14.1: Introduction to DOM
Submodule 14.1: Introduction to DOM
Completion requirements
View
DOM definition
DOM (Document Object Model) is a tree-like representation of the HTML structure of Web pages. All objects of an HTML page are included and can be manipulated by the DOM.
By manipulation, we mean that we change the content ( eg add/delete HTML ), the structure ( move an HTML element to another place) and their appearance ( change their style).
To get a sense of the DOM structure copy the below code and paste it on the "Markup to test" field of the Live DOM Viewer webpage.
You can also see the DOM of a page in the console - elements
and inspect these with the appropriate tool.
Exercise
- Open your editor, create a new file and save it as
exersice14.1.1.html
in the folder "yourNameWEB2JS". - Copy the code below and paste it in the new file.
- Open the console to see the results.
Resources: