首页 > 其他 > 详细

div的显示和隐藏

时间:2015-04-18 16:01:52      阅读:211      评论:0      收藏:0      [点我收藏+]

本文从学习角度出发,仅当做笔记。高手可以忽略本文。

 

借助div的display属性可以实现div的显示或隐藏,而且在隐藏后不占用原来显示的空间。

js控制显示和隐藏的代码:

 1 <script type="text/javascript">
 2         function showDiv(obj){
 3         document.getElementById(obj).style.display="";
 4         //alert(‘已经显示‘);
 5         }
 6     function hideDiv(obj){
 7         document.getElementById(obj).style.display="none";
 8         //alert(‘已经隐藏‘);
 9         }
10     </script>

HTML:

1     <input name="btnShow" type="button" value="显示" onClick="showDiv(‘div1‘);">
2     <input name="btnHide" type="button" value="隐藏" onClick="hideDiv(‘div1‘);">
3     <div id="div1" style=" width:300px; height:200px; border:1px solid red;">
4        show it
5     </div>

这个有时候在界面的设计上会用得到。

 

div的显示和隐藏

原文:http://www.cnblogs.com/huashanqingzhu/p/4437403.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!