Как рекурсивно искать все parentNodes

Question

Я хочу знать, как рекурсивно выяснить все родительские узлы элемента.Предположим, у меня есть следующий фрагмент

<a href="#"><font>Hello</font></a>

. В этом я хотел бы узнать, является ли родительский узел тега шрифта тегом привязки или нет.Теперь это можно сделать, просто проверив свойство .parentNode.Но что, если есть следующие случаи, такие как

<a href="#"><font><b>Hello<b></font></a>

или

<a href="#"><font><b><u>Hello</u><b></font></a>

Итак, в основном, как узнатьдостиг самого верхнего родительского узла?

Answer 1

Вы можете перемещаться от элемента до корня в поисках нужного тега:

function findUpTag(el, tag) {
    while (el.parentNode) {
        el = el.parentNode;
        if (el.tagName === tag)
            return el;
    }
    return null;
}

Вы вызываете этот метод с помощью стартового элемента:

var el = document.getElementById("...");  // start element
var a = findUpTag(el, "A");   // search <a ...>
if (a) console.log(a.id);

Answer 2

Следующая рекурсивная функция вернет возрастающий упорядоченный массив со всеми родительскими узлами для предоставленного элемента DOM, до достижения узла BODY .

function parents(element, _array) {
    if(_array === undefined) _array = []; // initial call
    else _array.push(element); // add current element
    // do recursion until BODY is reached
    if(element.tagName !== 'BODY' ) return parents(element.parentNode, _array);
    else return _array;
}

Использование:

var parentsArray = parents( document.getElementById("myDiv") );

Answer 3

Я работал над подобной вещью. Попытка закрыть div, если пользователь нажимает за пределами div. Он должен пройти через все родительские узлы.

посмотрите на это: http://jsfiddle.net/aamir/y7mEY/

Answer 4

Вы можете использовать метод jQuery closest () для получения ближайшего значения:

$("#your-element").closest("a").css("color", "red");

Или вы можете взглянуть на метод parentUntil :

$("#your-element").parentsUntil("#yourWrapper", "a").first().css("color", "red");

Попробуйте здесь: http://www.lunarailways.com/demos/parents.html