Question

我目前正在尝试选择某个div中没有内容的任何h2元素并将其删除。这是我的HTML代码：

 <div class="skipToContainer">
     <h2 class="vidSkipTo">Hello </h2>
     <h2 class="vidSkipTo"></h2>
     <h2 class="vidSkipTo"></h2>
     <h2 class="vidSkipTo"></h2>
 </div>

这些是我试过的一些jQuery代码：

jQuery(".skipToContainer .vidSkipTo").each (function () {
    if (jQuery(this).text().trim() === '')
        jQuery(this).remove();
}

jQuery(".skipToContainer h2").each (function () {
    if (jQuery(this).text().trim() === '')
        jQuery(this).remove();
}

jQuery(".skipToContainer h2").each (function () {
    if (jQuery(this).text() === '')
        jQuery(this).remove();
}

有什么建议吗？

注意：我正在本地WordPress网站上进行这些测试。不确定这是否重要，只是为了让你知道。

Answer 1

尝试

＆＃13;

jQuery(".skipToContainer h2").filter(":empty").remove();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
 <div class="skipToContainer">

          <h2 class="vidSkipTo">Hello </h2>
          <h2 class="vidSkipTo"></h2>
          <h2 class="vidSkipTo"></h2>
          <h2 class="vidSkipTo"></h2>

 </div>

＆＃13;

Answer 2

＆＃13;

$('.skipToContainer > .vidSkipTo:empty').remove();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="skipToContainer">
     <h2 class="vidSkipTo">Hello </h2>
     <h2 class="vidSkipTo"></h2>
     <h2 class="vidSkipTo"></h2>
     <h2 class="vidSkipTo"></h2>
 </div>

＆＃13;

如何检查元素的内容是否为空，如果是，则在jquery中删除该元素

2 个答案: