点击按钮切换内容效果(使用CSS DIV与JavaScript)

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了点击按钮切换内容效果(使用CSS DIV与JavaScript)相关的知识,希望对你有一定的参考价值。

<head>
<script type="text/javascript">
function change_div(id){
  if (id == ‘gsywly‘ )
  {
     document.getElementById("gsgs").style.display = ‘none‘ ;
     document.getElementById("gsywly").style.display = ‘block‘ ;
  }
  else
  {
     document.getElementById("gsywly").style.display = ‘none‘ ;
     document.getElementById("gsgs").style.display = ‘block‘ ;
  }
}
</script>

<style type="text/css">

    #gsywly { display:none;}

    li{list-style: none;}
</style>
</head>

<body>

    <ul>

         <li id="a"><a href="#" onclick="change_div(‘gsgs‘)">集团公告</a></li>
         <li id="b"><a href="#" onclick="change_div(‘gsywly‘)">单位公告</a></li>

    </ul>

  <div id="gsgs">A</div>
  <div id="gsywly" >B</div>
</body>

以上是关于点击按钮切换内容效果(使用CSS DIV与JavaScript)的主要内容,如果未能解决你的问题,请参考以下文章