Question

我下面有一个HTML：

<div id="keywords">
    <div id="container0">
        <span id="term010"> this</span>
        <span id="term111"> is</span>
        <span id="term212"> a</span>
        <span id="term313"> phrase</span>
    </div>

    <div id="container1">
        <span id="term014"> exact</span>
        <span id="term115"> match</span>
        <span id="term216"> type</span>
    </div>

    <div id="container2">
        <span id="term017"> this</span>
        <span id="term118"> is</span>
        <span id="term219"> a</span>
        <span id="term320"> broad</span>
    </div>
</div>

并且我想删除父级DIV（容器），如果子级跨度包含单词“ this”，则该内容为内容。
代码应在所有范围内搜索单词“ this”，并删除ID为“ container0”和“ container2”的div。我已经有了Regex，但是那之后我完全迷路了。我知道我应该使用querySelector，但是我以前从未使用过它并试图使其工作，但是失败了。

/\<span id="term[0-9]{3,}"> this<\/span>/gm

谢谢

Answer 1

您可以使用:contain()选择器。

@Pointcut("bean(*SomeString)")

$(document).ready(function(){

  $("#keywords").find("span:contains('this')").each(function(){
    if($(this).next("span").html()==" is"){  // Watch out for leading space!!!
      $(this).parent("div").remove();
    }
  });

});

Answer 2

您可以通过执行以下操作来完成jquery的查找（由于您提到了querySelector，因此您应该知道它也可以使用普通的javascript来完成-请参见下面的第二个代码示例）

JQuery：

let spans = $('span');

spans.each(function(index, elem) {
  if (elem.textContent.toLowerCase().indexOf('this') >= 0) {
    elem.parentNode.remove();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="keywords">
  <div id="container0">
    <span id="term010"> this</span>
    <span id="term111"> is</span>
    <span id="term212"> a</span>
    <span id="term313"> phrase</span>
  </div>

  <div id="container1">
    <span id="term014"> exact</span>
    <span id="term115"> match</span>
    <span id="term216"> type</span>
  </div>

  <div id="container2">
    <span id="term017"> this</span>
    <span id="term118"> is</span>
    <span id="term219"> a</span>
    <span id="term320"> broad</span>
  </div>
</div>

仅Java语言：

let spans = document.querySelectorAll('span');

for (let span of spans) {
  if (span.textContent.toLowerCase().indexOf('this') >= 0) {
    span.parentNode.remove();
  }
}

<div id="keywords">
  <div id="container0">
    <span id="term010"> this</span>
    <span id="term111"> is</span>
    <span id="term212"> a</span>
    <span id="term313"> phrase</span>
  </div>

  <div id="container1">
    <span id="term014"> exact</span>
    <span id="term115"> match</span>
    <span id="term216"> type</span>
  </div>

  <div id="container2">
    <span id="term017"> this</span>
    <span id="term118"> is</span>
    <span id="term219"> a</span>
    <span id="term320"> broad</span>
  </div>
</div>

jQuery搜索匹配的字符串并删除父div

2 个答案: