HTMLCollection vs NodeList

HTMLCollection Explained

HTMLCollection is a collection of HTML elements in an array-like list. This list will update dynamically and it can be extracted from the DOM by using document.getElementsByTagName() and other methods.

NodeList Explained

A NodeList is a collection of nodes that are stored in an array-like list. You can return this NodeList with Node.childNodes and other methods such as document.querySelectorAll().

HTMLCollection and NodeList similarities and differences

Both HTMLCollection and NodeList are array-like lists that are used by lot's of people. It seems newer browsers will often use HTMLCollection while some older browsers will use the NodeList. NodeLists also can contain any type of node while an HTMLCollection can only have HTML elements. Some other differences are how you return the list/collection and HTMLCollection is live while NodeList is static.

Summary

Overall, there are a lot of similarities and differences between a HTMLCollection and a NodeList. Which one you prefer is up to you, but they mostly serve the same purpose so it is just figuring out which one you like the most. There are many things to keep in-mind when doing this including browser compatability and which one works better in this situation. In the end they both do a great job at achieving their purpose and what one you want to use it completely up to you.