jQuery Atravessando

❮ Anterior Próxima Capítulo ❯

Um antepassado é um pai, avô, bisavô, e assim por diante.

Com jQuery você pode percorrer a árvore DOM para encontrar ancestrais de um elemento.

Atravessando Acima da árvore DOM

Três métodos jQuery úteis para atravessar a árvore DOM são:

parent()
parents()
parentsUntil()

jQuery parent() Método

O parent() retorna o elemento pai direto do elemento selecionado.

Este método só atravessar um único nível acima da árvore DOM.

O exemplo a seguir retorna o elemento pai direto de cada <span> elementos:

Exemplo

$(document).ready(function(){
$("span").parent();
});

Tente você mesmo "

jQuery parents() Método

O parents() método retorna todos os elementos ancestrais do elemento selecionado, todo o caminho até o elemento raiz do documento (<html>) .

O exemplo a seguir retorna todos os ancestrais de todas as <span> elementos:

Exemplo

$(document).ready(function(){
$("span").parents();
});

Tente você mesmo "

Você também pode usar um parâmetro opcional para filtrar a busca por ancestrais.

O exemplo a seguir retorna todos os ancestrais de toda <span> elementos que são <ul> elementos:

Exemplo

$(document).ready(function(){
$("span").parents("ul");
});

Tente você mesmo "

jQuery parentsUntil() Método

O parentsUntil() método retorna todos os elementos ancestrais entre dois argumentos dados.

O exemplo a seguir retorna todos os elementos ancestrais entre um <span> e <div> elemento:

Exemplo

$(document).ready(function(){
$("span").parentsUntil("div");
});

Tente você mesmo "

Teste-se com exercícios!

Exercício 1 » Exercício 2» Exercício 3 » Exercício 4»