jquery中使元素显示和隐藏方法之间的区别
2018-01-19 · 百度知道合伙人官方认证企业
育知同创教育
1【专注：Python+人工智能|Java大数据|HTML5培训】 2【免费提供名师直播课堂、公开课及视频教程】 3【地址：北京市昌平区三旗百汇物美大卖场2层，微信公众号：yuzhitc】
向TA提问
关注
![]()
展开全部
1.JQ中显隐有以下几种方式 show(),hide(),toggle(),slideDown()然后还有css设置div的style属性都可操作2.show()方法 显示出隐藏的 <p> 元素。 $(".btn2").click(function(){ $("p").show(); });3.toggle()方法 toggle() 方法切换元素的可见状态。如果被选元素可见，则隐藏这些元素，如果被选元素隐藏，则显示这些元素。 <html><head><script type="text/javascript" src="/jquery/jquery.js"></script><script type="text/javascript">$(document).ready(function(){ $(".btn1").click(function(){ $("p").toggle(1000); });});</script></head><body><p>This is a paragraph.</p><button class="btn1">Toggle</button></body></html> 3.slideDown()方法 以滑动方式显示隐藏的 <p> 元素： $(".btn2").click(function(){ $("p").slideDown();}); 4.hide() 方法隐藏可见的 <p> 元素：$(".btn1").click(function(){ $("p").hide();});这个函数经常与show一起使用 5.css()方法css() 方法设置或返回被选元素的一个或多个样式属性。返回 CSS 属性如需返回指定的 CSS 属性的值，请使用如下语法： css("propertyname");$("p").css("display","none"); 实例： <!DOCTYPE> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript"> $(document).ready( function(){}); function hiden(){ $("#divObj").hide();//hide()函数,实现隐藏,括号里还可以带一个时间参数(毫秒)例如hide(2000)以2000毫秒的速度隐藏,还可以带slow,fast } function slideToggle(){ $("#divObj").slideToggle(2000);//窗帘效果的切换,点一下收,点一下开,参数可以无,参数说明同上 } function show(){ $("#divObj").show();//显示,参数说明同上 } function toggle(){ $("#divObj").toggle(2000);//显示隐藏切换,参数可以无,参数说明同上 } function slide(){ $("#divObj").slideDown();//窗帘效果展开 } </script> </head> <body> <h3>div里内容的显示隐藏特效</h3> <input type="button" value="隐藏" onclick="hiden()"/> <input type="button" value="显示" onclick="show()"/> <input type="button" value="窗帘效果显示2" onclick="slide()"/> <input type="button" value="窗帘效果的切换" onclick="slideToggle()"/> <input type="button" value="隐藏显示效果切换" onclick="toggle()"/> <div id="divObj" style="display:none"> 1.测试例子 2.测试例子 3.测试例子 4.测试例子 5.测试例子 6.测试例子 7.测试例子 8.测试例子 9.测试例子 0.测试例子 </div> </body> </html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
一般有一些问题我都去w3c中看看，至于你说的区别
我还真不晓得，可能原理就是显示层的值大小。
jQuery hide() 和 show()
通过 jQuery，您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素：
$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});
以上是最常用的写法
$("button").click(function(){
$("p").hide(1000);
});
以上是加上时间
jQuery toggle()
通过 jQuery，您可以使用 toggle() 方法来切换 hide() 和 show() 方法。
显示被隐藏的元素，并隐藏已显示的元素：
实例
$("button").click(function(){
$("p").toggle();
});
以上是对show和hide的封装
我还真不晓得，可能原理就是显示层的值大小。
jQuery hide() 和 show()
通过 jQuery，您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素：
$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});
以上是最常用的写法
$("button").click(function(){
$("p").hide(1000);
});
以上是加上时间
jQuery toggle()
通过 jQuery，您可以使用 toggle() 方法来切换 hide() 和 show() 方法。
显示被隐藏的元素，并隐藏已显示的元素：
实例
$("button").click(function(){
$("p").toggle();
});
以上是对show和hide的封装
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
就是封装了一个 加style元素和移除style元素方法
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
