Question

我有一个将一些HTML附加到元素的函数。它可能不止一次被调用，所以我只希望它将HTML附加到尚未添加HTML的元素中。

示例：

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

因此，我想选择没有.myAppendedMarkup的直接孩子的所有.divToAppendTo

我的刺伤似乎不起作用：

$(".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

如果你不介意，我想我可能会为你想做的事情提供一个更简单的解决方案。

每当您将HTML附加到.divToAppendTo时，请执行$(this).removeClass("divToAppendTo"); 这样你只需要选择.divToAppendTo，同时确保它没有附加任何代码。

如果您将此类用于其他内容，则可以使用另一个类来执行此操作。

Answer 3

你能做到：

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

Answer 4

我喜欢它的可读性，它的效率与其他答案中最快的建议相当。

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

Answer 5

如果您不需要保留className，请转到Soufiane的答案，否则这应该有效：

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

或者如果你期望.divToAppendTo中有其他HTML，那么请使用：

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

使用jQuery NOT选择器来排除具有特定子元素的元素。

5 个答案: