如何检测元素节点列表中的每个元素是否具有特定的 css 类名称？

Question

给出以下测试环境...

const nodeList = document.querySelectorAll('p');
const testArray = Array.from(nodeList);

testArray.every(function (elmNode) {
  if (elmNode.classList.contains('ipsum')) {

    console.log(
      'All element nodes do feature the `ipsum` css-class name.'
    );
  }
});

.lorem {
  font-family: courier new, courier;
}

<p class="lorem ipsum">Lorem ipsum</p>
<p class="lorem dolor sit">dolor sit</p>
<p class="lorem amet">amet.</p>

...上述实现未记录正确的结果。

如何检测元素节点列表中的每个元素是否具有特定的 css 类名称？

对于上面的示例代码，如果满足条件（每个元素节点都有一个特定的类名），如何执行附加函数？

Answer 1

.every(...) 原型函数中使用的回调函数应该返回一个布尔值。如果你想根据所有元素是否包含值或满足某个类条件来执行操作，你应该根据 .every(...) 函数的结果来操作

let jaJivuSrediHohlochertei = Array.from(test)

let isHaveClass = jaJivuSrediHohlichertei.every(function(v){
    return v.classList.contains('hohlipidrili');
})

if(isHaveClass){
    alert('all itemts has this class')
}