-
Make sure you have forked this github Repo to your GitHub account.
You can do this by clicking the "Fork" button in the top right corner of this page.
https://github.com/olitreadwell/lecture-exercise-document-object-model-manipulation
-
Open the forked repo in your browser.
-
Open a codespace for the forked repo.
You can do this by clicking the blue "Code" button
Choosing the 'Codespaces' tab
Clicking the "New codespace" or "+" button
-
We will be working in the
index.html
file, initially. -
Open the
index.html
file in the file explorer. -
Open a preview of the
index.html
file in a new browser tab.You can do this by right-clicking on the
index.html
file in the file explorer and selecting "Open Preview".In the bottom right corner of the preview window, click the "Open Browser" button.
This will open a new browser tab with the
index.html
file loaded.Or you in the bottom bar of your local or in-browser editor, you can click the Port 3000 button and choose the Live Preview: Open in External Browser option.
-
Where should we include styles.css & script.js?
-
View the HTML site in the Chrome DevTools and better understand how the DOM is like a Tree
-
Change the URL for an HTML image using the Chrome DevTools Elements Window
-
Select an HTML element using getElementById()
-
Select an HTML element using querySelector()
-
Store an HTML element in a variable
-
Change the text of an HTML element using innerText
-
Change the style of an HTML element using style
-
Remove an HTML element using remove()
-
Add an HTML element using appendChild()