如何依照自己的意愿隐藏和显示页面上的元素

原创于 2016-11-25 11:01:21 发布 · 675 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了如何使用HTML和jQuery来实现网页元素的显示与隐藏功能。通过设置display属性为none可以在页面加载时隐藏元素；利用jQuery的show()和hide()方法则能在操作后灵活切换元素的可见状态。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1:如果你想在页面加载的时候这个元素就是隐藏着的,在元素上家display="none"属性,也可以如图,

<div class="container-fluid" style="display: none" id="itemDiv">
       <legend class="form-legend" style="margin-left: 5px;margin-top: 10px;font-size: 14px;">字典明细项</legend>
       <div id="dataGrid"  style="margin-left: 5px;width: 50%;" ></div>
</div>

2:如果在操作之后隐藏或者显示这个元素,可以,这样

$("#itemDiv").show();//使元素显示出来
$("#itemDiv").hide();//使元素隐藏出来
//这样,你留可以随意的显示或者隐藏

另外,关于display:none和visible:hidden隐藏的区别,可参考我转载的另外一篇文章 display:none与visible:hidden的区别