Выборка родительского и соседних элементов

Родительский элемент

Есть два способа выборки родительского элемента:

  • parentElement — выборка родительского элемента;
  • closest() — выборка указанного ближайшего родительского элемента (по правилам CSS).
// Выборка родительского элемента
document.getElementById('child').parentElement;

// Выборка указанного ближайшего родительского элемента, который является тегом <ul>
document.getElementById('child').closest("ul");

Если родительский элемент не будет найден, то вернётся значение «null».

Метод closest() поддерживается всеми современными браузерами. Браузером Internet Explorer не поддерживается (но поддерживается следующей версией браузера Internet Edge).

Следующий или предыдущий элемент

Выбрать соседние элементы можно через свойства nextElementSibling и previousElementSibling.

// Выборка следующего элемента
document.getElementById('child').nextElementSibling;

// Выборка предыдущего элемента
document.getElementById('child').previousElementSibling;

Если следующего или предыдущего элемента не будет, то свойство вернёт «null».