Навигация по DOM дереву
document.documentElement
– Получаем полный HTML код страницы
console.log(document.body);
console.log(document.documentElement);
childNodes
– получаем всех потомков (все ноды) родительского элемента body
console.log(document.body.childNodes);
firstChild
и lastChild
– Получем первого и последнего потомка родительского элемента
console.log(document.body.firstChild);
console.log(document.body.lastChild);
parentNode
– Получаем родительский элемент
console.log(document.querySelector('#current').parentElement);
Чтобы не получать пустые строки необходимо использовать функции previousElementSibling
, parentElemen
и тп.
console.log(document.querySelector('[data-current="3"]').previousElementSibling);
Переберем всех потомков body за исключением пустых строк #text
for (let node of document.body.childNodes){
if (node.nodeName == '#text'){
continue;
}
console.log(node);
}