Difference between .children and .childNodes

By | 2012/11/16

Consider following code:

<ul>
    <!-- Comment -->
    <li>Node 1</li>
    <li>Node 2</li>
</ul>
.children.length returns 2

but

.childNodes.length returns 5

everything is because there are text nodes before, after and between LI elements.

Remember that IE 6-8 threats comments as nodes, so children.length in these browsers returns 3 instead of 2.
Suppored in all browsers.

Similar Properties

.firstElementChild
.lastElementChild
 
.nextElementSibling
.previousElementSibling

Suppored in all browsers. (IE 9+).