div模块的隐藏与显示

html 控制：

       显示：<div id="test-hide" style="display:none">

       隐藏：<div id="test-show" style="display:block">

 

jquery控制：

      显示：$('#test-hide').show();

      隐藏：$('#test-show').hide();

      显示与隐藏切换：$("#test-hide").toggle();

 

来一个小demo

<div id="test-show" style="display:none">
<span>jQuery</span> 是一个兼容多浏览器的 JavasSript 框架,核心理念是 - write less, do more;
</div>
<button type="button" id="test-toggle">test</button>

$(function(){
　　$("div").append("<div>更多API请访问 <a target='_blank' href='http://jquery.cuishifeng.cn'>http://jquery.cuishifeng.cn</a></div>");
　　$('#test-toggle').click(function(){
　　　　$('#test-show').toggle();
　　});
});

       

转载于:https://www.cnblogs.com/xnn1993/p/6841964.html