码迷,mamicode.com
首页 > Web开发 > 详细

JS---元素隐藏的不同方式

时间:2019-12-25 20:29:50      阅读:115      评论:0      收藏:0      [点我收藏+]

标签:pac   get   utf-8   class   type   com   hidden   input   doc   

元素隐藏的不同方式

dispaly, visibility, opacity, height&border 为0

 

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <style>
    div{
      width: 300px;
      height: 200px;
      border:1px solid red;

    }
  </style>
</head>
<body>
<input type="button" value="显示效果" id="btn"/>
<div id="dv"></div>哈哈
<script src="common.js"></script>
<script>

  document.getElementById("btn").onclick=function () {
    //隐藏div
    //不占位
    //my$("dv").style.display="none";
    //占位
    //my$("dv").style.visibility="hidden";
    //占位
    //my$("dv").style.opacity=0;
    //占位
    //my$("dv").style.height="0px";
    //my$("dv").style.border="0px solid red";
  };
</script>
</body>
</html>

JS---元素隐藏的不同方式

标签:pac   get   utf-8   class   type   com   hidden   input   doc   

原文地址:https://www.cnblogs.com/jane-panyiyun/p/12098502.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!