nodo ancestro más cercano en jQuery

Question

En mi experiencia javascript, encontré que es una tarea muy común "buscar el antecesor más cercano de un elemento con alguna condición (nombre de etiqueta, clase, ...)". ¿Puede el método de jquery de parents() hacer el trabajo? El orden de los elementos devueltos de los padres() es predecible? ¿Es de arriba a abajo o de abajo hacia arriba? Por el momento utilizo esta función de utilidad:

function ancestor(elem, selector) { 
    var $elem = $(elem).parent(); 
    while($elem.size() > 0) { 
    if($elem.is(selector)) 
    return $elem; 
    else 
     $elem = $elem.parent(); 
    } 
    return null; 
} 

Puede alguien decirme si hay una forma inteligente de hacer el trabajo?

Answer 1

Editar: Desde jQuery 1.3, esto se ha incorporado como la función closest(). por ejemplo: $('#foo').closest('.bar');

---

Yep - los padres() atraviesa el árbol.

<div id="a"> 
    <div id="b"> 
     <p id="c"> 
      <a id="d"></a> 
     </p> 
    </div> 
</div> 

$('#d').parents("div:first"); seleccionará div b.

Answer 2

adición a la respuesta @nickf 's:

jQuery 1.3 simplifyed esta tarea con closest.

dado un DOM:

<div id="a"> 
    <div id="b"> 
     <p id="c"> 
      <a id="d"></a> 
     </p> 
    </div> 
</div> 

Usted puede hacer:

$('#d').closest("div"); // returns [ div#b ] 

[Closest vuelve a] conjunto de elementos que contienen el elemento más cercano padres que coincide con el selector especificado, el elemento inicial incluido.

Answer 3

Debe utilizar closest, porque parents no le dará el resultado que espera, si está trabajando con múltiples elementos. Por ejemplo, digamos que usted tiene esto:

<div id="0"> 
     <div id="1">test with <b>nested</b> divs.</div> 
     <div id="2">another div.</div> 
     <div id="3">yet <b>another</b> div.</div> 
    </div> 

y desea agregar una clase a los divs que tienen un elemento <b> como su hijo inmediato (es decir, 1 y 3). Si usa $('b').parents('div'), obtiene divs 0, 1 y 3. Si usa $('b').parents('div:first'), solo obtiene div 1. Para obtener 1 y 3, pero no 0, debe usar $('b').closest(elem).

Answer 4

más cercano() comienza a elemento actual, si el padre que busca tiene la misma etiqueta como corriente (por ejemplo. Ambos son divs), el uso de los padres(). Cercano()