我打算在页面的类中查找没有特定名称的元素。我必须使用DOM定位器和“ getElementsByClassName”。例如,我有以下列表:
<ol id="selectable">
<li class="ui-state-default ui-selectee" name="one">1</li>
<li class="ui-state-default ui-selectee" name="two">2</li>
<li class="ui-state-default ui-selectee" name="three">3</li>
<li class="ui-state-default ui-selectee" name="four">4</li>
<li class="ui-state-default ui-selectee ui-selected" name="five">5</li>
<li class="ui-state-default ui-selectee" name="six">6</li>
<li class="ui-state-default ui-selectee ui-selected" name="seven">7</li>
<li class="ui-state-default ui-selectee" name="eight">8</li>
<li class="ui-state-default ui-selectee" name="nine">9</li>
<li class="ui-state-default ui-selectee" name="ten">10</li>
<li class="ui-state-default ui-selectee ui-selected" name="eleven">11</li>
<li class="ui-state-default ui-selectee" name="twelve">12</li>
</ol>
我想找到不包含“ ui-selected”的元素。可以使用CSS的“ not”和/或其他方法轻松完成此操作,但是在这里必须使用DOM。
谢谢
最佳答案
尝试将document.querySelectorAll()与:not CSS selector一起使用:
// Check your browser's console output for result
console.log(
document.querySelectorAll('#selectable :not(.ui-selected)')
);
<ol id="selectable">
<li class="ui-state-default ui-selectee" name="one">1</li>
<li class="ui-state-default ui-selectee" name="two">2</li>
<li class="ui-state-default ui-selectee" name="three">3</li>
<li class="ui-state-default ui-selectee" name="four">4</li>
<li class="ui-state-default ui-selectee ui-selected" name="five">5</li>
<li class="ui-state-default ui-selectee" name="six">6</li>
<li class="ui-state-default ui-selectee ui-selected" name="seven">7</li>
<li class="ui-state-default ui-selectee" name="eight">8</li>
<li class="ui-state-default ui-selectee" name="nine">9</li>
<li class="ui-state-default ui-selectee" name="ten">10</li>
<li class="ui-state-default ui-selectee ui-selected" name="eleven">11</li>
<li class="ui-state-default ui-selectee" name="twelve">12</li>
</ol>
JSFiddle
关于javascript - 如何查找谁的类的元素不包含子字符串,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/42193244/