如果HTML元素尚未存在，则附加HTML元素

Question

<p id="main_class">
    <span class="new_class"></span>
</p>

在下面的代码中，如果<span class="new_class"></span>中不存在main_class并且它已经存在，则我想附加jQuery(".main_class").append('<span class="new_class">hello</span>'); ，然后阻止附加div。

我尝试了以下代码

{{1}}

Answer 1

您可以同时使用:not和:has选择器：

jQuery("#main_class:not(:has(.new_class))").append('<span class="new_class">hello</span>');

请注意main_class是id，因此您选择哈希（#）

JSFiddle

Answer 2

使用：

if(jQuery(".main_class").find('.new_class').length==0){
    jQuery(".main_class").append('<span class="new_class">hello</span>');
}

Answer 3

  

在Jquery中使用 .hasClass（） 。它返回true或false.Determine   是否为任何匹配的元素分配了给定的类。

if(!jQuery("#main_class span").hasClass("new_class")){
     jQuery("#main_class").append('<span class="new_class">hello</span>');
}

或在jquery中使用 .has（）

if(!jQuery("#main_class span").has("new_class")){
     jQuery("#main_class").append('<span class="new_class">hello</span>');
}

Answer 4

您正在使用.main_class课程，但我们只能看到id并且该课程似乎不存在。

尝试创建课程或使用id属性：

$("#main_class")