html隐藏域 js,JS实现“隐藏与显示”功能(多种方法)

下面我将效果图展示出来：

1，通过按钮实现隐藏与显示：

这个是通过按钮点击实现的隐藏与显示，具体代码如下：

通过按钮实现隐藏和显示

.body{

margin: 0 auto;

}

#show{

width: 600px;

height: auto;

font-size: 14px;

background-color: #E4C392;

display: block;

padding: 10px;

margin: 0 auto;

border-radius: 10px;

}

#show h2{

color: #11C2EE;

margin: 0 auto;

}

.slide{

margin: 0 auto;

padding: 0;

width: 600px;

border-top: solid 4px #D6A55C;

}

.btn-slide{

background-color: bisque;

width: 80px;

height:30px;

text-align: center;

marg