获取显示为块的元素

Question

我正在编写一个Chrome扩展程序，在其中列出一些内容的网页上工作。因此，基本上，我正在阅读该表并在javascript中进行一些计算并将其显示出来。现在，网页上有一个过滤器选项。过滤后，根据选择的过滤器，列表中没有显示某些内容。通过使显示为无显示来做到这一点。通过执行以下操作，它使显示为空：

[data-assignee]:not([data-aggr-assignees*="|xyz|"]) {
    display: none;
}

因此，当我尝试查找显示不为无的元素以查看过滤后的项目时，它会提供所有项目，因为看起来它没有更改项目的CSS属性。我检查了所有元素的style.display值，所有元素都将显示为。在这种情况下，有人可以帮助我如何获得显示阻塞的元素吗？

Answer 1

您可以使用 * 查询选择器整个文档，并使用 for 循环遍历每个元素，以检查其内联的 display 属性是否为设置为无。当然，这只会处理当元素被内联CSS隐藏时的情况。

  

DIV

 
<脚本>
var allElems = document.querySelectorAll（“ *”）;
var visibleElems = [];
var hiddenElems = [];
for（让i = 0; i   

如果要检查CSS样式表中元素的 display 属性，则需要使用 window.getComputedStyle 。

  .hidden {
  显示：无；
}  

  

DIV

 
 
<样式>



 
<脚本>
var allElems = document.querySelectorAll（“ *”）;
var visibleElems = [];
var hiddenElems = [];
for（让i = 0; i