如何用js检测一个元素是显示还是隐藏

原创于 2020-01-08 14:05:33 发布 · 1.3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js

JavaScript 专栏收录该内容

9 篇文章

订阅专栏

js 判断元素是显示还是隐藏

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            width: 100px;
            height: 20px;
            border: solid 1px silver;
        }
    </style>
</head>
<body>
<div id="div1"></div>
<script>
      var display=document.getElementById("div1").style.display;
    //变量display是获取的当时那个状态，赋给dom元素的新值需要用具体的dom元素获取。
    if(display=="none"){
        document.getElementById("div1").innerHTML="";
        //div要显示的内容
        document.getElementById("div1").style.display = "inline-block";
        //使之可见
        //设置为“none”也可以，作用都是为了检测元素的display状态
        //不能给变量直接赋值 如display = ""，这是在给变量赋值，而不是在给dom元素赋值;
    }
    else{
        document.getElementById("div1").innerHTML="";
        //div要显示的内容
        document.getElementById("div1").style.display = "none";
        //使之不可见
    }
</script>
</body>