В этом руководстве вы узнаете, как получить родительский узел элемента с помощью JavaScript-атрибута parentNode Node объекта.
Чтобы получить родительский узел в дереве DOM, используйте свойство parentNode :
let parent = node.parentNode;
parentNode только для чтения.
Document и DocumentFragment не имеют родителя. Поэтому свойство всегда будет null.
Если вы создаете новый узел, но не присоединяете его к дереву DOM, parentNode этого узла также будет null.
Пример
Пример HTML-документа:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript parentNode</title>
</head>
<body>
<div id="main">
<p class="note">This is a note!</p>
</div>
<script>
let note = document.querySelector('.note');
console.log(note.parentNode);
</script>
</body>
</html>
На следующем рисунке показан вывод в консоли:
Как это работает:
- Сначала выберите элемент с
.noteс помощью методаquerySelector(). - Затем найдите родительский узел элемента.
Заключение
node.parentNodeв JavaScript возвращает доступный только для чтения родительский узел указанного узла илиnull, если он не существует.documentиDocumentFragmentне имеют родительского узла.