Можно ли указать селектор для parentNode?

Question

[DeniSidorenko]

Привет, как всем известно в jquery можно указать $(selector).parent(selector);

Дело в том что начал работать на чистом js, и там nodeParent которые не принимает селектор. Как по другому сделать, ибо parent находится на 7 уровней высше и писать постоянно nodeParent.nodeParent не хочется. и возможно ли это?

Comments

[napa3um]

Для выборки нод по всем возможным "координатам" в дереве документа есть XPath, более мощный инструмент, чем CSS-селекторы: https://developer.mozilla.org/en-US/docs/Introduct...

[napa3um]

(Хотя чаще проще использовать не его, а просто немного JS-кода с промежуточной обработкой выборки, например, методом closest.)

Answer 1

[Павел Корнилов]

Если нужно указать на селектор, то на него лучше и указывать. Есть querySelector().
А вот если нужно именно найти родительский элемент в цепочке родителей, удовлетворяющий каким-то условиям, то можно сделать несложную рекурсивку

<div id="target">
	<div></div>
	<div>
		<p onclick="console.log('findParent= ', findParent(this, {id:'target'}));">Найти родителя с id="target"</p>
	</div>
</div>
<script>
	'use strict';
	function findParent (o, cond) {
		o= o.parentNode;
		return (o && o.id && (o.id === cond.id))? o : findParent(o, cond);
	}
</script>

Comments

[Stalker_RED]

querySelector найдет один все элемент с заданным классом. querySelectorAll - найдет все элементы. А нужен только родитель.

[Павел Корнилов]

Stalker_RED: А Вы мою функцию тестировали? Я же пример привел с поиском из параграфа по клику родительского элемента с id="target".

[Stalker_RED]

KorniloFF: Зачем этот велосипед, если есть closest?
Для старых браузеров есть полифилл.

[Павел Корнилов]

Stalker_RED: функция в 2 строки. И не нужно полифилла =)

Answer 2

[Stalker_RED]

element.closest(selector)

Answer 3

[Николай]

Ну только если через while как-то:

// текущий элемент
var element = ...;
while(%условие по которому ищите%) {
    element = element.parentNode;
}