С вершины дерева можно пойти дальше вниз. Для этого каждый DOM-узел содержит массив всех детей, отдельно – ссылки на первого и последнего ребенка и еще ряд полезных свойств.
Все дочерние элементы, включая текстовые, находятся в массиве childNodes.
цикл перебирает всех детей document.body
for(var i=0; i<document.body.childNodes.length; i++) { var child = document.body.childNodes[i] alert(child.tagName) }
Видите, что у childNodes есть свойство length, которое есть у любого массива. Именно столько раз мы будем запускать цикл, для обработки каждого элемента массива. После того, как мы получили дочерний элемент (мы его просто сохранили в переменную), мы выводим имя тега элемента.
Свойства firstChild и lastChild показывают на первый и последний дочерние элементы и равны null, если детей нет.
Свойство parentNode указывает на родителя. Например, для <body> таким элементом является <html>
Свойства previousSibling и nextSibling указывают на левого и правого братьев узла.