如何检查独立于父级可见性的元素可见性（是否为 jQuery）

Question

我的第一个问题所以请耐心等待。我有一个容器，其中包含不同数量的子元素，如下所示：

<div class="parent">
    <div class="element">content</div>
    <div class="element">content</div>
    <div class="element">content</div>
</div>

快速问题： 是否有 jQuery 或纯 JS 方法来检查element容器是否可见而独立于parent可见状态？

只是简单地要求

jQuery('.parent .element:visible').length

不起作用。​

背景：容器parent可以切换，子元素的内容element通过ajax请求获取，并在响应到达时填充。对于我收到的每个响应，子容器都会获取指示响应类型的特定类，例如available等等unavailable。所以生成的 DOM 可能如下所示：

<div class="parent">
    <div class="element available">content</div>
    <div class="element unavailable">content</div>
    <div class="element unavailable">content</div>
</div>

这是一个与不同 CSS 文件一起使用多次的模块。所以我不控制 CSS 实现是否真正隐藏unavailable元素，因为这仅在 CSS 中完成。并且容器可以是打开的，但不是必须的。但我必须知道在不打开容器的情况下容器内部是否会有可见元素。这可能吗？

提前致谢！

Answer 1

如果您有可用或不可用之类的课程，我不确定为什么需要这样做。但这就是我要做的（所以实际的可见性不会干扰孩子的可见性）：

if (
    $('.element').css('display') != 'none' && 
    $('.element').css('visibility') != 'hidden'
) {
    // ...
}

行动中：

http://jsfiddle.net/EbaMY/2/