jQuery - Eltern Selektoren

Question

Ich kann nicht herausfinden, wie genau Eltern Selektor in jQuery funktioniert.

var test = $("p:contains('Lorem ipsum dolor sit amet')").parentsUntil("span"); 
 
    
 
    
 
    test.css({ "border" : "1px solid red"});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    \t \t \t <p>Title</p> 
 
    \t \t \t <span> 
 
    \t \t \t \t <p>Span</p> 
 
    \t \t \t \t <div> 
 
    \t \t \t \t \t <p>Div</p> 
 
    \t \t \t \t \t <p>Lorem ipsum dolor sit amet</p> 
 
    \t \t \t \t </div> 
 
    \t \t \t </span> 
 
    \t \t \t <tr> 
 
    \t \t \t \t <th>Xx</th> 
 
    \t \t \t \t <td>YY</td> 
 
    \t \t \t </tr> 
 
    \t \t </table>

Wie Grenze um Spanne zu bekommen? Mein Code funktioniert nicht.

Answer 1

Sie müssen nur verwenden .closest() statt, zusammen mit .parent():

var test = $("p:contains('Lorem ipsum dolor sit amet')").parent().closest("span"); 

UPDATE

Sie auch mit parentsUntil halten können(), aber hinzufügen parent() aus offensichtlichen Gründen:

var test = $("p:contains('Lorem ipsum dolor sit amet')").parentsUntil("span").parent(); 

Aber das wird nicht funktionieren, wenn die direkte Mutter vom Typ „span“, weil parentsUntil das aktuelle Element ausschließt.