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