Использование селектора jQuery NOT для исключения элементов с определенными дочерними элементами.

Question

У меня есть функция, которая добавляет HTML к элементу. Его можно вызывать более одного раза, поэтому я хочу, чтобы он только добавлял HTML к элементам, в которые еще не был добавлен HTML.

Пример:

<div class="divToAppendTo"></div>
<div class="divToAppendTo"><span class="myAppendedMarkup"></span></div>

Поэтому я бы хотел выбрать все .divToAppendTo, у которых нет непосредственного потомка .myAppendedMarkup

Кажется, мой удар не работает:

$(".divToAppendTo:not(>span.myAppendedMarkup)")

Он всегда добавляется, когда я его называю (таким образом дублируя содержимое).

Answer 1

попробуй

$("div.divToAppendTo:not(:has(span.myAppendedMarkup))")

или

$("div.divToAppendTo").filter(function() { 
    return $(this).children('span.myAppendedMarkup').length == 0;  
});

Answer 2

вы можете сделать:

$(".divToAppendTo:not(:has(span.myAppendedMarkup))");

Answer 3

Если вы не возражаете, я думаю, у меня может быть более простое решение для того, что вы пытаетесь сделать.

Всякий раз, когда вы добавляете HTML к .divToAppendTo, делайте $(this).removeClass("divToAppendTo"); таким образом, вам просто нужно будет выбрать .divToAppendTo, будучи уверенным, что к нему не добавлен код.

Если вы используете этот класс для чего-то другого, вы всегда можете использовать другой для этого.

Answer 4

Мне нравится его удобочитаемость, и он сопоставим по эффективности с самым быстрым предложением в других ответах.

var completeSet = $( "div.divToAppendTo" );
var unwantedSet = completeSet.has( "span.myAppendedMarkup" );    
var wantedSet   = completeSet.not(unwantedSet);

Answer 5

Если вам не нужно оставлять className на месте, обратитесь за ответом к Суфиане, иначе это должно сработать:

$('div.divToAppendTo').filter(function() {
    return $(this).html() == '';
}) );

Или, если вы ожидаете какой-то другой HTML в .divToAppendTo, используйте это:

$("div.divToAppendTo").filter(function() { 
    return $(this).children('span.myAppendedMarkup').length == 0;  
});