html课题研究学习日记#32

Js小功能

通过js 点击按钮实现显示和隐藏操作

主要思路：借助js控制css的display属性

1.在HTML中设置唯一ID标识tbcontent

<div class="widget">

     <h2 class="widget-title" id="btnShowClose" οnclick="funShowClose()">最近文章</h2>

  <div class="blog-list-widget" >

  <div class="list-group" id="tbcontent" style="display: block;">

 2、js 实现点击事件，借助 document.getElementById 进行修改对display 属性

function funShowClose(){      

                                           //var btnShowClose = document.getElementById("tabShowClose").style.display="none";

                if(document.getElementById("tbcontent").style.display=="none"){

                    document.getElementById("tbcontent").style.display="block";

                }else{

                    document.getElementById("tbcontent").style.display="none";

                } 

            }

本日学习时间三小时