Cacher is the code snippet organizer for pro developers

Поиск по DOM

document.getElementsByTagName("p"); //взять все элементы с тегом p.
document.getElementsByClassName("paragraph"); //взять все элементы с классом paragraph
document.getElementById("four"); //взять элемент с айдишником four
document.querySelector("p"); //выдаст первый p элемент
document.querySelectorAll("p"); //выдаст все p элементы на странице. getElementsByTagName работает быстрее
document.querySelectorAll("div p"); //выдаст все p элементы находящиеся в теге div
document.querySelector("#four"); //выдаст элемент с id four. getElementById работает быстрее

Свойства Узлов

elems[i].tagName //имя тега
elems[i].parentNode //родительский узел
elems[i].previousSibling.previousSibling  //предыдущий узел
elems[i].nextSibling.nextSibling //следующий узел
elems[i].previousSibling.nodeName //имя узла

elems[i].nodeType //тип узла
elems[i].previousSibling.nodeType

if (elems[i].nodeType === 1) {
  console.log( "Это узел элемента" );
}

if (elems[i].previousSibling.nodeType === 3) {
  console.log( "Это текстовый узел" );
}

}

document.querySelector("div").childNodes//дочерние узлы
document.querySelector("div").children //дочерние элементы
document.querySelector("div").lastChild //последний дочерний узел
document.querySelector("div").firstChild // первый дочерний узел
document.querySelector("div").innerHTML //выдает содержимое узла в виде строки