jQuery搜索一組選擇器中的特定元素，如果找不到，添加它

我需要在一組「容器」div中搜索類「a2」。如果找到了，什麼都不要做;如果缺少，請添加它。jQuery搜索一組選擇器中的特定元素，如果找不到，添加它

原始代碼：

<div class="container"> 
    <div class="a1"> 
    <span class="Label">Status:</span> 
    <span class="Text">Active</span> 
    </div> 
    <div class="a2"> 
    <span class="Label">Description:</span> 
    <span class="Text">2</span> 
    </div> 
</div> 

</br> 
</br> 

<div class="container"> 
    <div class="a1"> 
    <span class="Label">Status:</span> 
    <span class="Text">Active</span> 
    </div> 
</div> 

</br> 
</br> 

<div class="container"> 
    <div class="a1"> 
    <span class="Label">Status:</span> 
    <span class="Text">Active</span> 
    </div> 
</div>

這裏是我的腳本：

$('div.container').each(function(){ 
    if($(this).children('.a2').length == 0){ 
     $('<div class="a2"><span class="Label">Description:</span><span class="Text">0</span></div>').insertAfter('div.a1');  
     return false; 
    }  
});

看到demo這裏。

問題是腳本在不需要的第一個「容器」中插入「a2」div。有人能幫我弄清楚我做錯了什麼嗎？

來源

2013-01-19 user1824996

.insertAfter('div.a1');

在每個div.a1元素後插入元素。你想要的是它附加到當前div.container：

.appendTo(this);

另外，不要return false。它會停止整個循環。 if已經警告是否添加。

來源

2013-01-19 21:50:47 pimvdb

非常感謝解釋離子，我現在明白它好多了。 – user1824996

$('div.container').filter(function(){ 
    return $('.a2', this).length === 0; 
}).append('<div class="a2"><span class="Label">Description:</span><span class="Text">0</span></div>');

或：

$('div.container').not(":has('div.a2')") 
        .append('<div class="a2"><span class="Label">Description:</span><span class="Text">0</span></div>');

http://jsfiddle.net/xGACz/

來源

2013-01-19 21:52:23 undefined

也可以使用'：not（：has（.a2））'。 – pimvdb

@pimvdb是的，我通常使用'filter'方法來過濾元素。 – undefined

感謝您的更正。棒極了。 – user1824996

可以使用not方法和:has選擇過濾容器，這樣你只有那些沒有a2元素：

$('div.container').not(':has(> .a2)').append(
    $('<div class="a2"><span class="Label">Description:</span><span class="Text">0</span></div>') 
);

來源

2013-01-19 22:07:43 Guffa

jQuery搜索一組選擇器中的特定元素，如果找不到，添加它

回答

相關問題