在执行代码之前，如何遍历某些类的所有元素？

Question

假设我有一个“狗”类。 我有5个元素都具有“狗”类。 我要检查是否所有具有“狗”类的元素都具有特定的背景色。 如果他们有我想执行某些代码。 我不会通过每一个元素要循环，并在每次迭代之间执行的代码。 我想要的是在执行代码之前先检查所有具有特定背景颜色的元素。

我尝试了这个：

function openBtn () {
  green = 'rgb(144, 238, 144)';

  if ($('.glassver').css('background-color') == green || $('.glasshor').css('background-color') == green || $('.glassxyz').css('background-color') == green) {
    $('#orderBtn').removeAttr('disabled', 'disabled');
    $('#orderBtn').css("background-color", "#3da669");
  } else {
    $('#orderBtn').attr('disabled', 'disabled');
    $('#orderBtn').css("background-color", 'lightgray');
  }
}

Answer 1

获取所有具有dog类的div元素，并从中构建一个数组。

然后使用array的every方法检查背景色条件。 如果对所有人都正确，请执行代码

 const dogs = Array.from(document.querySelector('div.dog')); if (dogs.every(d => d.style.backgroundColor === 'red')) { console.log('do some code'); } 

 <div class="dog" style="background-color:red">DOG 1</div> <div class="dog" style="background-color:red">DOG 2</div>