如果DOM元素包含字符串,请删除该元素

Remove DOM element if it contains a string

本文关键字:元素 删除 字符串 DOM 包含 如果      更新时间:2023-09-26

所以我有这个代码,它检查Name是否存在,如果存在,它会删除它嵌套的span标记。

<div id="box">
  <br>
  <span style="font-size: 12px">
    <a>
      <span style="color: #000000">
        <b>Name</b>
      </span>
    </a>
  </span>

然而,名称也可以放在这些标签中:

  <br>
  <span>
    <a>Name</a>
  </span>
</div>

如何使用jquery进行检查?我试过:

$('span:contains("Name")').remove();
$('span > a > span b:contains("Name")').remove();

似乎什么都不管用。

编辑#2:还有一些br标签,我刚刚把它们包括在内。我只想删除它们,前提是它们在删除的标签之前。

谢谢。

如果您想准确地以文本"Name"为目标元素,可以使用filter(),而不是以文本为目标元素的:contains,例如"Name with some other text…":

在.load()回调函数内设置代码

$('#box').load('myUri', function () {
    $('#box span').has('b, a').filter(function () {
        return $.trim($(this).text()) === "Name";
    }).remove();
});

等效于:contains的是:

$('#box span').has('b, a').filter(function(){
    return $(this).text().indexOf("Name") != -1;
}).remove();

更新了以下评论:

$('#box').load('myUri', function () {
     $('#box span').has('b, a').filter(function () {
         var toRemoveSpan = $(this).text().indexOf("Name") != -1 ? true : false;
         if (toRemoveSpan && $('span').prev('br').length) {
             $(this).prev('br').remove()
         }
         return toRemoveSpan;
     }).remove();
 });

这将给出相同的结果:$('#box').empty();

如果这不是你想要的行为,你必须在你的问题中更加具体。

这样的东西怎么样:

$('a:contains("Name"),b:contains("Name")').parents("span").remove();

根据编辑,您需要在加载元素后执行脚本。

你需要利用加载方法的回调来完成这项工作,如果你使用.load(),那么它有一个成功的回调,你可以在那里调用这个

试试这个:

$(function () {
    $('div#box span a span b:not(:contains("Name"))').remove();
})

DEMO