怎么让一个div显示一个div隐藏
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了怎么让一个div显示一个div隐藏相关的知识，希望对你有一定的参考价值。
参考技术A 1.找出这两个div的class或id
2.
做相应的显示或隐藏处理即可；
3.
<div
id="div_1"></div>
//要显示的div;
<div
id="div_2"></div>//要隐藏的div;
显示：style="display:block"或者
$('#div_1').show();
隐藏：style="display:none"或者$('#div_2').hide(); 参考技术B 让一个div显示一个div隐藏的方法如下（代码的规格写法只能这样）：
1、html代码如下：
<body>
<ul
class="point">
<li><a
href="#">menu0</a></li>
<li><a
href="#">menu1</a></li>
<li><a
href="#">menu2</a></li>
<li><a
href="#">menu3</a></li>
<li><a
href="#">menu4</a></li>
<li><a
href="#">menu5</a></li>
<li><a
href="#">menu6</a></li>
<li><a
href="#">menu7</a></li>
</ul>
<div
class="box">
<div
class="con0">d0</div>
<div
class="con1">d1</div>
<div
class="con2">d2</div>
<div
class="con3">d3</div>
<div
class="con4">d4</div>
<div
class="con5">d5</div>
<div
class="con6">d6</div>
<div
class="con7">d7</div>
</div>
</body>
2、CSS代码：
.point
float:
left;
list-style:
none;
.point
li
margin-bottom:
10px;
.box
float:
right;
margin-right:
500px;
.box
div
width:
500px;
height:
200px;
border:
1px
solid
green;
display:
none;
.box
.con0
display:
block;
3、javascript代码：
$(document).ready(function()
$(".point
li
a").click(function()
var
order
=
$(".point
li
a").index(this);//点击之后可以返回当前a标签index的值
$(".con"
+
order).show().siblings("div").hide();
);
)
怎么用js显示隐藏div
参考技术A怎么用js来显示或隐藏一个div？很简单，下面一起来看一下。
- 01
首先我们创建一个div，和一个按钮。用按钮的点击来控制div的显示或隐藏。
02添加一个样式名叫hide的样式，主要是设置display=none，即隐藏。
03接着用js来实现显示，隐藏的功能。我们用Jquery的hasClass方法来判断div是否有hide样式，有则删除这个样式，即显示div。如果没有，则添加一个hide的样式，即隐藏div。
04运行页面，我们点击按钮，如果div是正在显示的，点击后就会隐藏，如果是隐藏状态的，点击后就会显示。
以上是关于怎么让一个div显示一个div隐藏的主要内容，如果未能解决你的问题，请参考以下文章