js实现折叠&展开

最近在做一个div的折叠与展开功能，在网上搜了多种方法，各有各的功能，但个人觉得有一种方法比较简洁明了，因此来总结一下——

比较关键的是一段js代码，如下：

$(document).ready(function(){   
    var i=$('#num').text();
    $(".btn-slide1").click(function(){
       $("#panel1").slideToggle("slow");
       if(i%2==1){$(".btn-slide1").text("展开")； }
       if(i%2==0){$(".btn-slide1").text("关闭")； }
       i++;
    });
});

其中，num是作为一个隐藏的span的id,btn-slide1是标签的class名，panel1就是你要控制折叠与展开的div的id，类似下面一段：

 

展开
                              2

最后附上实现的效果图：