Question

我想获得其ID不包含字符串的结果（让我们说它是＆＃34; s＆＃34; test＆＃34;）

<ul class="numberlist">
  <li id="test1" style="display:none">
    <div></div>
  </li>
  <li>
    <a>one</a>
  </li>
  <li>
    <a>two</a>
  </li>
  <li>
    <a>three</a>
  </li>
  <li id="test2" style="display:none">
    <div></div>
  </li>
  <li>
    <a>four</a>
  </li> 
  <li id="test" style="display:none">
    </div></div>
  </li>
</ul>

正如我所说，我想排除哪个包含字符串test的id。我怎样才能实现它？

我可以通过编写

获取<li>的列表

document.querySelectorAll('ul.numberList')

但我想用他们的身份排除其中一些。

Answer 1

您可以将 attribute contains selector 与 :not() 伪类选择器

一起使用

document.querySelectorAll('ul.numberlist li:not([id*="test"])')

console.log(document.querySelectorAll('ul.numberlist li:not([id*="test"])').length)

<ul class="numberlist">
  <li id="test1" style="display:none">
    <div></div>
  </li>
  <li>
    <a>one</a>
  </li>
  <li>
    <a>two</a>
  </li>
  <li>
    <a>three</a>
  </li>
  <li id="test2" style="display:none">
    <div></div>
  </li>
  <li>
    <a>four</a>
  </li>
  <li id="test" style="display:none">
    <div></div>
  </li>
</ul>

仅供参考： document.querySelectorAll('ul.numberList')，未获得所有li元素，而是获取所有ul类numberList。要将所有li内部使用选择器设为ul.numberList li。您的html类名称中还有numberlist而非numberList。

Answer 2

我猜您正在寻找:not()和“以”选择器开头：

document.querySelectorAll('ul.numberList li:not([id^=test])')

（或者如果您想要“包含”，请将^替换为*，而不是“以”开头“

使用querySelector排除其id包含特定字符串的元素

2 个答案: