如何獲取具有某個類的所有父元素，並且其子元素通過jQuery在其給定屬性中具有某個字符串值？

Question

我怎樣才能得到所有的HTML父元素有一個叫做".example"的css類和他們的孩子<a></a>元素包含字符串值說sample-section在href屬性通過jQuery？

下面是一個例子：

<li class="example"> 
    <a href="root/sample-section/p01">Page 1</a> 
</li> 
<li class="example"> 
    <a href="root/sample-section/p02">Page 2</a> 
</li> 
<li class="example"> 
    <a href="root/another-section/p01">Page 1</a> 
</li> 
<li class="example"> 
    <a href="root/another-section/p02">Page 2</a> 
</li> 

我希望能夠通過jQuery我上面提到的，以獲得第一，在這個例子中，第二<li></li>元素（它們包含字符串「樣品部分」）標準並向他們添加某些其他類。提前致謝！

Answer 1

$('a[href*=sample-section]').parent('.example'); 

http://jsfiddle.net/mblase75/eG82u/

或

$('.example').filter(function(){ 
    return $(this).children('a[href*=sample-section]').length; 
}); 

http://jsfiddle.net/mblase75/kWV86/

- 應該返回相同的結果。

http://api.jquery.com/attribute-contains-selector/

http://api.jquery.com/filter/

Answer 2

與^使用屬性選擇器，其獲取與給定文本

所有的HREF開始嘗試這個..

console.log($('a[href^="root/sample-section/"]').parent()) 

或*選擇所有元素具有包含值的指定屬性給定的子字符串。

console.log($('a[href*="sample-section"]').parent()) 

fiddle here

Answer 3

試試這個：

$('li.example > a[href*="sample-section"]').closest('li.example'); 

Answer 4

在一個行：

$('li.example a[href*="sample-section"]').parent(); 

jsFiddle example

Answer 5

$('li.example a[href*="another-section"]').each(function() { 
    $(this).closest('li'); 
});