javascript - 非 jQuery 相当于 :visible in JavaScript?

Question

所以 jQuery 提供了这个很棒的伪类来在 DOM 中查询“:visible”，不幸的是，它与 jQuery 和 Sizzle(或您可能使用的任何引擎)的核心紧密相关。当只知道给定元素时，在普通 JavaScript 中是否有一个很好的等价物？

关于 jQuery 的提醒:可见规则:

• 它们的 CSS 显示值为 none。
• 它们是 type="hidden"的表单元素。
• 它们的宽度和高度明确设置为 0。

祖先元素是隐藏的，因此该元素不会显示在页面上。

注意:只检查给定元素的样式并不总是有效:可能会隐藏父元素而不是隐藏所有子元素。

Answer 1

您可以从source code获取相关代码:

jQuery.expr.filters.hidden = function( elem ) {
    var width = elem.offsetWidth,
        height = elem.offsetHeight;

    return ( width === 0 && height === 0 ) ||
           (!jQuery.support.reliableHiddenOffsets &&
           ((elem.style && elem.style.display) || jQuery.css( elem, "display" )) === "none");
};

• jQuery.css 可以替换成getComputedStyle (或 IE 的 .currentStyle)。
• jQuery.support.reliableHiddenOffsets 是一个变量，用于确定属性是否可靠 (IE8-)。