Extra Practice

Remember: Learning to program takes practice! It helps to see concepts over and over, and it's always good to try things more than once. We learn much more the second time we do something. Use the exercises and additional self-checks below to practice.

1. Save Buttons

Review the code, then answer the questions below.

let saveButtons = document.querySelectorAll('.save-button');

for (let button of saveButtons){
    button.addEventListener('click', function(event){
        let contentID = event.target.dataset.id;
        console.log(`Saving ${contentID}`);
    });
}

What is saveButtons equal-to?

an Array-like collection of DOM elements selected by '.save-button' the first element in the DOM with the 'save-button' class a DOM element object undefined saveButtons contains an Array-like collection of DOM elements.

Inside the for loop, what name is used to refer to each individual button element?

saveButtons[] button event undefined Inside the for loop, the button variable refers to each individual button element during each iteration of the loop.

What will event.target refer to inside the event listener?

The handler function. The event listener itself. The button the user clicked. undefined The event.target property will refer to the button element the user clicked.

What event is being listened for?

mouseover click load DOMContentLoaded The click event is being listened for.

What attribute on the save button would have contained the contentID?

data-contentID data-id contentID ID The data-id attribute would be accessible as event.target.dataset.id.

Visit Content Online

The content on this page has been removed from your PDF or ebook format. You may view the content by visiting this book online.

results matching ""

    No results matching ""