JavaScript свойство parentNode

Определение и применение

JavaScript свойство parentNode объекта Node возвращает узел, который является родителем данного узла. В том случае, если узел не имеет родителя, или родитель не является элементом, то это свойство вернет значение null. Свойство доступно только для чтения.

Родителем элемента может являться узел Element, узел Document, или узел DocumentFragment. Узлы Document и DocumentFragment никогда не могут иметь родителя, поэтому свойство parentNode всегда будет возвращать значение null. Свойство parentNode также возвращает null, если узел только что был создан и еще не присоединен к дереву DOM.

Для того, чтобы возвратить элемент, который является родительским для этого узла, а не узел, то Вы можете воспользоваться свойством parentElement.

Поддержка браузерами

Свойство	Chrome	Firefox	Opera	Safari	IExplorer	Edge
`parentNode`	Да	Да	Да	Да	Да	Да

JavaScript синтаксис:

const parentNode = node.parentNode;

node - Node

Спецификация

Document Object Model (DOM) Level 2

Пример использования

<!DOCTYPE html>
<html>
	<head>
		<title>Использование JavaScript свойства parentNode</title>
	</head>
	<body>
		<div>
			<p onclick = "myFunc(this)">Click me</p> <!-- добавляем атрибут событий onclick -->
		</div>
		<div>
			<p onclick = "myFunc(this)">Click me</p> <!-- добавляем атрибут событий onclick -->
		</div>
		<div>
			<p onclick = "myFunc(this)">Click me</p> <!-- добавляем атрибут событий onclick -->
		</div>
		<script>
	function myFunc(currentElem) {
	  currentElem.parentNode.style.display = "none"; // устанавливаем родительскому узлу текущего элемента значение свойства display равным none
	}
		</script>
	</body>
</html>

В этом примере с использованием атрибута событий onclick при нажатии на определенный HTML элемент <p>, мы вызываем функцию, которая устанавливает родительскому узлу элемента <p>, по которому произошло нажатие, значение CSS свойства display равным none. В результате чего этот элемент будет скрыт.

Результат нашего примера:

Пример использования JavaScript свойства parentNode

JavaScript Node