Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript and the DOM (Retiring) Getting a Handle on the DOM Using CSS Queries to Select Page Elements

Posted by Kirt Perez
Kirt Perez
7,374 Points

Node list vs HTML collection?

Hello, we've first learned about .getElementsByTagName and .getElementsByClassName and we know that they return a HTML collection that is like an array. This video, we learn .querySelectorAll. The docs for this method says it returns a node list rather than an HTML collection despite looking like another array. What is the distinction between the two?

2 Answers

Joseph Lander
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Joseph Lander
Full Stack JavaScript Techdegree Graduate 27,764 Points
Joseph Lander
.a{fill-rule:evenodd;}techdegree seal-36
Joseph Lander
Full Stack JavaScript Techdegree Graduate 27,764 Points

I find this interesting as well. In my limited experience, I found that I lumped the two together as "not as useful as a fully-fledged array" and if I want to actually do much with the list, beyond looping through it, I convert it to an actual array.

However, w3schools has this page with some more detail specifically on your question towards the bottom: https://www.w3schools.com/js/js_htmldom_nodelist.asp

Samuel Kleos
.a{fill-rule:evenodd;}techdegree
Samuel Kleos
Front End Web Development Techdegree Student 12,719 Points

Not the best explanation, nor do the comments on the medium post support it.