Why do we log things to the console?
- To verify and check code.
- To use for bug checking.
What is a “model”?
- A representation of something, but not the real thing.
Which “document” is being referred to in the phrase Document Object Model?
- The html document.
Which “objects” are being referred to in the phrase Document Object Model?
- The data type objects within the JavaScript language.
What is a DOM Tree?
- A model of a web page.
- A model of a portion of a webpage.
- (An element plus all of its content and configurations).
Give two examples of document methods that retrieve a single element from the DOM.
- querySelector(). (Always just use this for selecting a single element query).
- getElementByID(). (Old, not really needed anymore).
Give one example of a document method that retrieves multiple elements from the DOM at once.
- querySelectorAll(). (Always just use this for selecting multiple element queries.
Why might you want to assign the return value of a DOM query to a variable?
- To reuse it later.
- Cut down on amount of code.
- Cleans up code.
What console method allows you to inspect the properties of a DOM query to a variable?
- console.dir().
Why would a
tag need to be placed at the bottom of the HTML content, instead of at the top?
- Gives the HTML time to load before any of the JavaScript loads, which can prevent errors, and can speed up website response time.
What does document.querySelector() take as its argument and what does it return?
- It takes a string (a CSS selector) as its argument, and it returns THE FIRST element that matches the CSS selector (which is an object).
What does document.querySelectorAll() take as its argument and what does it return?
- It takes a string as its argument, and returns a NodeList.
What is the purpose of events and event handling?
- Interactivity. The developer can prepare for actions taken by users and create a response.
Are all possible parameters required to use a JavaScript method or function?
- No, not necessary at all times.
What method of element objects lets you set up a function to be called when a specific type of event occurs?
- add.eventListener.
What is a callback function?
- Taking a function and passing it around.
- Ex. sharing a recipe with a friend.
What object is passed into an event listener callback when the event fires?
- Information about what happened with the event.
What is the event.target? If you weren’t sure, how would you check? where could you get more info about it?
- The element that triggers the event.
- Console.log.
- MDN
What is the difference between these two snippets of code?
element.addEventListener(‘click’, handleClick):
- This is passing a variable in as the function.
element.addEventListener(‘click’, handleClick()):
- This is calling the function inside the event listener method.
(DO NOT DO THIS)
