What is the DOM?
The DOM, or Document Object Model, is a tree-like representation of the contents of a webpage.
How do you target the nodes you want to work with?
You use a combination of CSS-style selectors and relationship properties along with the DOM method, querySelector, to target the nodes you want.
How do you create an element in the DOM?
You use the DOM method, createElement, to create an element in memory.
How do you add an element to the DOM?
You use the DOM methods, appendChild (for adding to a parent node) or insertBefore (for adding a node into a parent and before reference node).
How do you remove an element from the DOM?
You use the DOM method, removeChild.
How can you alter an element in the DOM?
You can alter an element by create a reference to the node using the createElement method.
When adding text to a DOM element, should you use textContent or innerHTML? Why?
How do “events” and “listeners” work?
Events are actions performed on the webpage or DOM. Then listeners are listening for these events to occur and reacting to them.
What are three ways to use events in your code?
Why are event listeners the preferred way to handle events?
We maintain a separation of concern and can use multiple event listeners.
What are the benefits of using named functions in your listeners?
They are more organized and easier to reuse.
How do you attach listeners to groups of nodes?
Use querySelectorAll to get a group of nodes or nodelist then iterate through them and attach an eventListener to each node
What is the difference between the return values of querySelector and querySelectorAll?
querySelector returns a specific nodes while querySelectorAll returns a nodelist.
What does a “nodelist” contain?
A nodelist is an Array-like list of nodes.
Explain the difference between “capture” and “bubbling”.
Capturing is the top-down selection of elements to the target element while bubbling is the bottom-up selection of elements to the target element. They are both phases of Event Propagation which occurs when an event is performed on the webpage.