如何通过JS判断一个元素是否显示、隐藏

文章目录

• 如何通过JS判断一个元素是否显示、隐藏
• • • 通过display是否等于none来判断
    • 通过jquery的:hidden/:visible 伪类来判断
    • 说明

通过display是否等于none来判断

通过判断当前元素的display的值来判断当前元素是否是可见状态。只能用display来对none进行对比判断。因为可见元素的状态可能是block、inline等

代码实现

<div class="wrap" style="display:none">我是一个元素，来判断我是否是可见的
div>

function  isNone(){if ($("div").css("display") == "none") {alert("这是一个diaplay=none的元素")}else{alert("这不是一个diaplay=none的元素")}
}

通过jquery的:hidden/:visible 伪类来判断

代码实现

<div class="wrap" style="display:none">我是一个元素，来判断我是否是可见的
div>

function isHidden() {if ($("div").is(':visible')) {alert("这是一个可见元素");}else{alert("这是一个不可见元素");}if ($("div").is(':hidden')) {alert("这是一个隐藏元素");}else{alert("这是一个不隐藏元素");}
}

说明

无论元素是通过设置dispaly还是通过添加伪类:hidden来进行的控制，都可以使用其中一种方式进行判断。即：如果元素是通过添加伪类实现的隐藏，依旧可以通过display来进行判断

<div class="wrap :hidden">我是一个元素，来判断我是否是可见的
div>

function showDisplay(){alert($(".wrap").css("display"));
}

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！