JavaScript JavaScript and the DOM Making Changes to the DOM Modifying Elements

Janelle Mackenzie
Janelle Mackenzie
6,673 Points

confused with querySelectorAll method...

I can't seem to understand why something like the first line of code is valid, but the second isn't.

<p>const p = document.querySelector('p.description'); </p>
<p>const p = document.querySelector('p#par1');</p>

Also I don't know why these lines of code would not be valid/the same as each other:

          <p>const p = document.getElementsByTagName('ul li a');</p>
          <p>const p = document.querySelectorAll('ul li a');</p>

1 Answer

Steven Parker
Steven Parker
203,748 Points

First, the HTML tag marks (like "<p>") aren't for JavaScript and should be omitted.

Second, none of these relate to the linked challenge page, so what would be correct for the first two is based on some HTML that's not shown here.

// this would select a paragraph with class "description"
const p = document.querySelector('p.description');

// this would select a paragraph with an ID of "par1"
const p = document.querySelector('p#par1');  // you can simplify the selector to just '#par1'

// this function takes only a simple tag name, not a complex selector
const p = document.getElementsByTagName('ul li a');

// this is the correct function when using a complex selector
const p = document.querySelectorAll('ul li a');