Javascript jQuery .hide() 和 .css("display", "none") 的区别
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13562439/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Difference between jQuery .hide() and .css("display", "none")
提问by Sashi Kant
Is there any difference between
有什么区别吗
jQuery('#id').show() and jQuery('#id').css("display","block")
and
和
jQuery('#id').hide() and jQuery('#id').css("display","none")
回答by Chris
jQuery('#id').css("display","block")
jQuery('#id').css("display","block")
The displayproperty can have many possible values, among which are block, inline, inline-block, and many more.
该display属性可以有许多可能的值，其中有block，inline，inline-block，和更多。
The .show()method doesn't set it necessarily to block, but rather resets it to what you defined it (if at all).
该.show()方法不一定将其设置为block，而是将其重置为您定义的内容（如果有的话）。
In the jQuery source code, you can see how they're setting the displayproperty to "" (an empty string) to check what it was before any jQuery manipulation: little link.
在 jQuery 源代码中，您可以看到他们如何将display属性设置为 ""（一个空字符串）以在任何 jQuery 操作之前检查它是什么：little link。
On the other hand, hiding is done via display: none;, so you can consider .hide()and .css("display", "none")equivalent to some point.
另一方面，隐藏是通过 完成的display: none;，因此您可以考虑.hide()并.css("display", "none")等效于某个点。
It's recommended to use .show()and .hide()anyway to avoid any gotcha's (plus, they're shorter).
建议使用.show()并且.hide()无论如何要避免任何问题（另外，它们更短）。
回答by Talha
Difference between show() and css({'display':'block'})
show() 和 css({'display':'block'}) 的区别
Assuming you have this at the beginning:
假设你一开始有这个：
<span id="thisElement" style="display: none;">Foo</span>
when you call:
你打电话时：
$('#thisElement').show();
you will get:
你会得到：
<span id="thisElement" style="">Foo</span>
while:
尽管：
$('#thisElement').css({'display':'block'});
does:
做：
<span id="thisElement" style="display: block;">Foo</span>
so, yes there's a difference.
所以，是的，有区别。
Difference between hide() and css({'display':'none'})
hide() 和 css({'display':'none'}) 的区别
same as above but change these into hide() and display':'none'......
与上面相同，但将它们更改为 hide() 和 display':'none'......
Another differenceWhen .hide()is called the value of the display property is saved in jQuery's data cache, so when .show()is called, the initial display value is restored!
另一个区别当.hide()被调用时，显示属性的值保存在jQuery的数据缓存中，所以当.show()被调用时，恢复初始显示值！
回答by aquasan
Yes there is a difference in the performance of both:
jQuery('#id').show()is slower than jQuery('#id').css("display","block")as in former case extra work is to be done for retrieving the initial state from the jquery cache as display is not a binary attribute it can be inline,block,none,table, etc.
similar is the case with hide()method.
是的，两者的性能存在差异：
jQuery('#id').show()比jQuery('#id').css("display","block")前一种情况慢，因为显示不是二进制属性，它可以是, , , 等inline，需要额外的工作才能从 jquery 缓存中检索初始状态。方法就是这种情况。blocknonetablehide()
回答by Arsen Mkrtchyan
With no parameters, the .hide() method is the simplest way to hide an element:
$('.target').hide(); The matched elements will be hidden immediately, with no animation. This is roughly equivalent to calling .css('display', 'none'), except that the value of the display property is saved in jQuery's data cache so that display can later be restored to its initial value. If an element has a display value of inline, then is hidden and shown, it will once again be displayed inline.
没有参数， .hide() 方法是隐藏元素的最简单方法：
$('.target').hide(); 匹配的元素将立即隐藏，没有动画。这大致相当于调用 .css('display', 'none') ，只不过 display 属性的值保存在 jQuery 的数据缓存中，以便稍后可以将 display 恢复到其初始值。如果一个元素的显示值为 inline ，然后隐藏并显示，它将再次内联显示。
Same about show
节目也一样
回答by Jonas Ibsen
Yes there is a difference.
是，有一点不同。
jQuery('#id').css("display","block")will always set the element you want to show as block.
jQuery('#id').css("display","block")将始终设置要显示为块的元素。
jQuery('#id').show()will et is to what display type it initially was, display: inline for example.
jQuery('#id').show()will et 是它最初是什么显示类型，例如 display: inline。
See Jquery Doc
请参阅Jquery 文档
回答by Samuel Caillerie
You can have a look at the source code(here it is v1.7.2).
你可以看看源代码（这里是v1.7.2）。
Except for the animation that we can set, this also keep in memory the old display style (which is not in all cases block, it can also be inline, table-cell, ...).
除了我们可以设置的动画外，这还保留了旧的显示样式（并非在所有情况下block，也可以是inline, table-cell, ...）。
回答by Corinne Kubler
see http://api.jquery.com/show/
With no parameters, the .show() method is the simplest way to display an element:
没有参数， .show() 方法是显示元素的最简单方法：
$('.target').show();
$('.target').show();
The matched elements will be revealed immediately, with no animation. This is roughly equivalent to calling .css('display', 'block'), except that the display property is restored to whatever it was initially. If an element has a display value of inline, then is hidden and shown, it will once again be displayed inline.
匹配的元素将立即显示，没有动画。这大致相当于调用 .css('display', 'block') ，除了 display 属性恢复到它最初的样子。如果一个元素的显示值为 inline ，然后隐藏并显示，它将再次内联显示。
