【JavaScript】点击按钮展开与收起

<script>
function showBtn(argument) {
// body...
document.getElementById('hidden').style.display="block";
document.getElementById('hiddenBtn').innerText = "收起按钮";/修改超链接的文字/
document.getElementById('hiddenBtn').href = "javascript:hideBtn()";/修改点击链接代码/
}
function hideBtn(argument) {
// body...
document.getElementById('hidden').style.display="none";
document.getElementById('hiddenBtn').innerText = "隐藏按钮";
document.getElementById('hiddenBtn').href = "javascript:showBtn()";
}
</script>

点击按钮显示或隐藏.png

    body{
        margin: 0 auto;
        padding: 0;
    }
    #show{
        background-color: #e8e8e8;
        width: 700px;
        display: block;
        margin: 0 auto;
        /*网页中内容居中显示*/
        padding: 5px;
        font-size: 9pt;
        /* 9pt的字体是没有锯齿的  */
        height: auto;
        /*因整个div部分，会有一部分动态显示或者隐藏，所以将高度设为auto*/
    }
    #hidden{
        display: none;
    }
    .slide{
        margin: 0 auto;
        padding: 0px;
        width: 700px;
        border-top: solid 4px gray;
    }
    .hiddenBtn{
        background-color: grey;
        width: 120px;
        height: 30px;
        text-align: center;
        margin: 0 auto;
        display: block;
        color: #fff;
        text-decoration: none;
        padding-top: 10px;
    }