2012-02-09 120 views
6

我試圖做一些事情,如果div包含某個元素,但似乎無法觸發條件。這是我的最佳鏡頭。測試div是否沒有元素

<div class='test'> 
    testing123 
</div> 

<div class='test'> 
    <p>testing456</p> 
</div> 

$('.test').each(function(){ 
    if(!$(this).has('p')) { 
     $(this).addClass('red'); 
    } 
}); 

該腳本只是針對絕對的一切。 這裏是一個活的小提琴 - http://jsbin.com/igoyuk/edit#javascript,html,live

回答

11

請注意,.has()返回jQuery,不是布爾!

。先後(選擇器)返回:jQuery的
描述:減少匹配元素到那些具有使選擇或DOM元素相匹配的後代。

if(!$(this).has('p'))總是如此,因爲jQuery總是返回一個集合,即使它是空的!

.has()基本過濾設置,是呼籲,所以你只需要做:

$('.test').has('p').addClass('red'); 
+0

這很好,我怎麼能做到相反,即'沒有'p?謝謝 – SparrwHawk 2012-02-09 16:05:38

+2

像這樣的例子:'$('。test:not(:has(p))'') – 2012-02-09 16:07:31

+0

很棒,你得到了投票,因爲你解釋了爲什麼它沒有工作:-)謝謝! – SparrwHawk 2012-02-09 16:11:22

3
if (!($(this).find('p').length > 0)) { 
    $(this).addClass('red'); 
} 
0

您可以使用以下條件來檢查缺少的元素類型:

if($('p', $(this)).length == 0) 

由於$('p', $(this))將返回所有p元素的當前內元件。

2

考慮使用以下:

$("div.test:has(p)").addClass("red"); 

此查詢您的DOM的<div>元素,只選擇那些與測試類,然後看看它是否有一個<p/>元素。它更簡潔=通過線路傳輸更少的字節。