jquery怎么判断元素是否隐藏

jquery判断元素是否处于隐藏状态，有多种方法。但大致的逻辑都是判断div的CSS隐藏属性，下面是判断方法。

jquery判断元素是否隐藏的方法

方法1：

JQ判断元素的CSS样式中的 display 属性，元素css样式的 display 属性的值如果设置为 none ，则元素会被隐藏。通过jq获取css的 display 的属性值是否为 none，来判断元素是否为隐藏状态。

<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
<style>
    #main{
        display: none;
    }
</style>
<div id="main">
    我是被隐藏的！
</div>
<script>
    var isnone = $('#main').css('display');
    if(isnone == 'none'){
        // 元素隐藏
    }else{
        // 元素没有被隐藏
    }
</script>

方法2：

使用jq内置的选择器进行判断，其有两种判断方式。

(1)、:hidden 判断是否为隐藏状态

if($("#main").is(":hidden")){
    console.log('隐藏状态');
}else{
    console.log('显示状态');
}

(2)、:visible 判断是否为显示状态

if($("#main").is(":visible")){
    console.log('显示状态');
}else{
    console.log('隐藏状态');
}

PS：注意jquery选择器 :hidden 与 :visible 用法，它们两个的作用是相反的！