Для получения дочерних элементов в JavaScript существует две возможности: .childNodes и .children.

  • .childNodes является свойством Node. Это свойство имеют все узлы дерева.
  • .children является свойством Element. Данное свойство имеют только элементы типа Element и все возвращаемые значения точно такого же типа.

К примеру есть у нас менюшка, в которую нужно добавить класс active. 

<ul class="nav" id="sidebar-menu">
	<li>
		<a href="http://nonamez.name">
			<i class="glyphicon glyphicon-home"></i>
			<span class="hidden-xs">Sites</span>
		</a>
	</li>
</ul>

Цепляем его по ID и смотрим результат: 

document.getElementById('sidebar-menu').childNodes
вернёт NodeList[, li, ] 

document.getElementById('sidebar-menu').children
вернёт HTMLCollection[li]

Как видим в первом варианте нам возвращает массив элементов с текстовым контентом вокруг него, во втором только массив элементов.