Quiz: The Document Object Model

Try this self-check quiz to test your knowledge!

The Document Object Model (DOM) is a hierarchy that most closely resembles what object?

a tower a spiderweb a tree a tournament bracket The DOM uses a tree-like hierarchy to relate all of its nodes.

Every node in the DOM represents what?

a link a section a view an HTML element Every node in the DOM represents and HTML element.

What three relationships between nodes are key to the DOM hierarchy?

parent child sibling cousin The three relationships between nodes in the DOM are: parent, child, and sibling.

Which method selects the first matching element in the document?

document.querySelectorAll() document.getElementsByClass() document.querySelector() document.getElementsByTagName() The document.querySelector() method returns the first matching DOM element.

Which command creates a new button?

let button = document.new('button'); let button = document.createElement(''); let button = document.createElement('button'); let button = document.makeElement('{button}'); The let button = document.createElement('button'); command creates a new button.

Which command adds the we just created to the DOM?

document.body.appendChild(button); document.insert(button); window.appendChild(button); document.insertBefore(button); The document.body.appendChild(button); command appends the button to the body of the document.

What can we accomplish by modifying a DOM element's innerHTML attribute?

Add child elements and content. Alter text content. Clear existing content. Modify parent element content. Add event listeners. We cannot modify parent element content or add event listeners with innerHTML.

What method allows us to add an attribute to a DOM element?

element.getAttribute() element.createAttribute() element.setAttribute() element.makeAttribute() The element.setAttribute() method is used to create a new attribute on a DOM element (and also to alter an existing attribute).

Which are valid CSS property names in JavaScript?

fontFamily background-position marginTop font-weight background Dashes are not allowed in JavaScript object attribute names, so they must be converted to camelCase.

What does the window.getComputedStyle() method return?

A style object with all of the CSS properties affecting the visual display of the DOM element (including those inherited from parent elements). A properties object with some of the CSS properties affecting the visual display of the DOM element. An Array of the CSS properties affecting the visual display of the DOM element based on CSS files. A style object with only the CSS properties defined explicitly for the DOM element. text The window.getComputedStyle() method returns a style object with all of the CSS properties affecting the visual display of the DOM element (including those inherited from parent elements).

What prefix indicates that an HTML attribute is intended to store information for computing?

info- db- data- query- param- The data- prefix indicates that an HTML attribute is intended to store information for computing.

How can we access the data attributes of an HTML element from within JavaScript?

element.getData() element.dataset element.getAttribute() element.db element.fetchData() Data stored in HTML data attributes is available in the element.dataset object.

Visit Quiz Online

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

results matching ""

    No results matching ""