jquery 查找具有类和样式显示的元素：块

jquery find element with class and style display:block

提问by spiderman

I am retrieving the number of "found" elements (these elements have the .highlightclass) with this simple jQuery snippet:

我正在.highlight使用这个简单的 jQuery 代码段检索“找到”元素的数量（这些元素具有类）：

$(".highlight").length

But now my problem is that some elements are hidden, via style="display: none;"

但现在我的问题是某些元素被隐藏了，通过 style="display: none;"

Now, How can I get the number of elements highlighted AND displayed?

现在，如何获得突出显示和显示的元素数量？

Something like:

就像是：

$(hasClass 'highlight' AND has style 'display: block'). length ?

回答by Adil

You can use :visibleto get element which are visible.

您可以使用:visible来获取可见的元素。

$(".highlight:visible").length

回答by dimitrisk

One way is to use :visiblejQuery pseudo selector as Adil mentioned.

一种方法是使用:visibleAdil 提到的 jQuery 伪选择器。

A common pitfall is that if the element with class .highlightis nested to a container which is hidden then you wont be able to get it even though that element has display: block

一个常见的陷阱是，如果带有 class 的元素.highlight嵌套到一个隐藏的容器中，那么即使该元素具有display: block

Instead you could use css regex as follows: $('.highlight[style*="display: block"]')

相反，您可以使用 css regex 如下： $('.highlight[style*="display: block"]')

A common pitfall is that you need to know exactly how the rule is written. If there is no space before blocklike so: display:blockinstead of display: blockyou wont be able to get the element either.

一个常见的陷阱是您需要确切地知道规则是如何编写的。如果之前没有空格，则block这样：display:block而不是display: block您也将无法获得该元素。

A way to overcome this is to search only for the term blockin the styles like so: $('.highlight[style*="block"]')

克服这个问题的一种方法是仅搜索block样式中的术语，如下所示： $('.highlight[style*="block"]')

回答by Somnath Kharat

U can also do by using cssto see the element has css display="none"or display="block"

你也可以通过使用css来查看元素是否有 css display="none"或display="block"

 $(".highlight").each(function(){
       if($(this).css("display")=="block"){
          //Your code here
       }
    });