时间戳

首页 > 解决方案 > 我们如何检查是否所有的 div 都显示为 none

html - 我们如何检查是否所有的 div 都显示为 none

问题描述

如果设置了所有 div，我想显示 NO 结果之类的消息 display none

element.each(function(i, el) {
    if (all element set display:none) {
        no result found
    }
}

<div class="a" data-key="a" style="display:none"></div>
<div class="a" data-key="a" style="display:none"></div>
<div class="a" data-key="a" style="display:none"></div>
<div class="a" data-key="a" style="display:none"></div>
<div class="a" data-key="c" style="display:none"></div>
<div class="a" data-key="c" style="display:none"></div>

标签： htmljquery

解决方案

下面的 vanilla JavaScript 中的一个非常快速的示例选择了您的代码示例中的 ，并使用with 选择器divs将它们放入一个数组中。querySelectorAllclass name

如果传入数组中的任何元素不是，areAllDivsDisplayNone则将返回。falsedisplaynone

const areAllDivsDisplayNone = (divs) => {
  let allDisplayNone = true;
  for (let i in divs) {
    if (divs[i].style.display !== 'none') {
      allDisplayNone = false;
      break;
    }
  }
  return allDisplayNone;
};

const els = Array.from(document.querySelectorAll('.a'));
const results = areAllDivsDisplayNone(els);

if (results) {
  console.log('Results!');
} else {
  console.log('No results!');
}

我使我的代码示例更加冗长，因此更易于阅读。

推荐阅读