Javascript：如何检查元素是否可见？

我正在使用轻量级zepto.js框架，现在我需要测试页面上的元素是否可见……我的情况如下：

一个按钮触发函数

show\u guides（）

如果

$（“#指南”）

可见，我想保存一个cookie，如果不可见，我想删除它

但是zepto.js不支持像

：visible

这样的选择器，所以我必须找到一种不同的方法。 有什么办法吗？现在我得到了以下错误：

未捕获错误：语法错误：DOM异常12

在zepto文档中，我读到了

对于jQuery的非标准伪选择器的基本支持，例如 ：可见，包括可选的“选择器”模块

但我不知道如何包括这一点

---

有人能帮我吗？提前感谢。

您可以检查显示CSS属性：

 function show_guides() {

        $('#guides').toggle();

        if ( $('#guides').css('display') == 'block' ) { 
            console.log("visible");
        } else {
            console.log("invisible");
        }
    }

---

您可以检查显示CSS属性：

 function show_guides() {

        $('#guides').toggle();

        if ( $('#guides').css('display') == 'block' ) { 
            console.log("visible");
        } else {
            console.log("invisible");
        }
    }

试一试

及

试一试

及

---

可以检查可见性：可见/隐藏，或显示：块/无

$('#guides').css('visibility') == 'visible'
$('#guides').css('display') == 'block'

---

可以检查可见性：可见/隐藏，或显示：块/无

$('#guides').css('visibility') == 'visible'
$('#guides').css('display') == 'block'

---

如果您只想检查可见性，则可以使用此选项

  function visible(elem){
    elem = $(elem)
    return !!(elem.width() || elem.height()) && elem.css("display") !== "none"
  }

---

直接从zepto选择器插件获取。否则，您可以按照Felix Kling的建议从中包括选择器模块

，如果您只想检查可见性，您可以使用此选项

  function visible(elem){
    elem = $(elem)
    return !!(elem.width() || elem.height()) && elem.css("display") !== "none"
  }

---

直接从zepto选择器插件获取。否则，您可以按照Felix Kling的建议从中包含selectors模块，“但我不知道如何包含它。”加载任何其他JavaScript文件的方式相同。加载zepto后包含。“但我不知道如何包含它。”与加载任何其他JavaScript文件的方式相同。加载zepto后包含。如果隐藏了祖先，则此操作无效。例如，隐藏的div中的图像将返回“block”，即使它不可见，因为它的容器div是隐藏的。如果祖先是隐藏的，这不起作用。例如，隐藏div中的图像将返回“block”，即使它不可见，因为它的容器div是隐藏的。