Jump to content
Omar~

[RESOLVIDO] Localizar se um parente possui certo atributo

Recommended Posts

Opa!

Então eu to com um problema que preciso localizar se um elemento clicado possui possui algum de seus parentes um atributo.

Logo esse click está "e é obrigatório que esteja" vinculado ao documento então não posso checar isso a partir dele, então o que eu fiz foi criar uma função que obtém todos os elementos antecessores ao qual ele(s) pertence(m).

 

Nesse exemplo que preparei para demostrar a questão estou tentando saber se um elemento clicado possui algum parente com o atributo data.

A função por sua vez me traz um array com todos os parente e bingo lá está o elemento com esse atributo, o problema que preciso entrar numa condição caso haja esse atributo entre os elementos da lista.

Spoiler

<!DOCTYPE html>
<html>
    <head>
        <title>a</title>
        <meta charset="UTF-8">
        <style>
            div { padding: 40px; border: 1px solid black }
        </style>
        <script>
            function teste(e) {
                var click = e.target;
                var parente = NodeParents(click);
                console.log(parente);
            }
            function NodeParents(node) {
                var atual = node, lista = [];
                while (atual.parentNode != null && atual.parentNode != document.documentElement) {
                    lista.push(atual.parentNode);
                    atual = atual.parentNode;
                }
                return lista;
            }
            document.addEventListener('click', teste, false);
        </script>
    </head>
    <body>
        <div>Primeiro</div>
        <div data-alvo="alvo">
            Segundo
            <div>
                Terceiro
                <div>
                    Quarto
                </div>
            </div>
        </div>
        <div>
            Quinto
            <div>
                Sexto
            </div>
        </div>
    </body>
</html>

 

 

Como deu para perceber não posso pegar esse valor pelo índice do array, tenho que saber se nesse array possui algum elemento com esse atributo.

 

Para facilitar a situação da ajuda coloquei o código no JSFiddle: https://jsfiddle.net/SpellMaster/npfw1xhk/1/

 

Quem puder dar uma força aqui agradeço porque estou quebrando a cabeça numa coisa tão simples e não estou conseguindo achar uma solução.

Share this post


Link to post
Share on other sites

Putz foi só pensar um pouquinho que achei a solução.

Bastava eu fazer outro loop em cima do array e verificar cada item.

Segue a solução caso alguém no futuro caia de para-quedas aqui:

 

function teste(e) {
    var click = e.target;
    var parente = NodeParents(click);
    var encontrado = null;
    for (var i = 0; i < parente.length; i++) {
        if (parente[i].dataset.alvo == 'alvo') {
            encontrado = true;
            break;
        }
    }
    if (encontrado) {
        console.log('Existe um parente com o "data alvo"');
    } else {
        console.log(parente);
    }
}

function NodeParents(node) {
    var atual = node, lista = [];
    while (atual.parentNode != null && atual.parentNode != document.documentElement) {
        lista.push(atual.parentNode);
        atual = atual.parentNode;
    }
    return lista;
}

document.addEventListener('click', teste, false);

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.