.hide（）或display：none？ jQuery的
我最好做什么？ .hide()比写出.css("display","none")更快，但是它们究竟有什么不同呢？
从关于.hide（）的jQuery页面：
“匹配的元素将立即隐藏，没有animation，这大致等同于调用.css（'display'，'none'），除了display属性的值保存在jQuery的数据caching中，恢复到它的初始值，如果一个元素有一个内联的显示值，然后被隐藏和显示，它将再一次显示为内联。
所以，如果能够恢复到以前的display值是很重要的，那么最好使用hide()因为以前的状态被记住。 除此之外，没有任何区别。
$(function() { $('.hide').click(function(){ $('.toggle').hide(); setDisplayValue(); }); $('.show').click(function(){ $('.toggle').show(); setDisplayValue(); }); }); function setDisplayValue() { var display = $('.toggle')[0].style.display; $('.displayvalue').text(display); }
div { display: table-cell; border: 1px solid; padding: 5px; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <p> <button class="hide">Hide</button> <button class="show">Show</button> </p> <div class="toggle">Lorem Ipsum</div> <p> The display value of the div is: <span class="displayvalue"></span> </p>
.hide()将之前的 display属性设置为none ，所以如果它不是元素的标准display属性，那么.show()将使用该存储的属性作为返回的内容至。 所以…它做了一些额外的工作，但除非你做了大量的元素，速度差异应该可以忽略不计。
看着jQuery代码，这是发生了什么事情：
hide: function( speed, easing, callback ) { if ( speed || speed === 0 ) { return this.animate( genFx("hide", 3), speed, easing, callback); } else { for ( var i = 0, j = this.length; i < j; i++ ) { var display = jQuery.css( this[i], "display" ); if ( display !== "none" ) { jQuery.data( this[i], "olddisplay", display ); } } // Set the display of the elements in a second loop // to avoid the constant reflow for ( i = 0; i < j; i++ ) { this[i].style.display = "none"; } return this; } },
他们是一样的东西。 .hide()调用一个jQuery函数，并允许你为它添加一个callback函数。 所以，用.hide()你可以添加一个animation例如。
.css("display","none")更改要display:none的元素的属性display:none 。 就像在JavaScript中执行以下操作一样：
document.getElementById('elementId').style.display = 'none';
.hide()函数显然需要更多的时间来运行，因为它检查callback函数，速度等。
使用这两个是一个很好的答案; 这不是一个或两个问题。
使用两者的优点是CSS会在页面加载时立即隐藏元素 。 jQuery .hide会将元素闪烁四分之一秒，然后隐藏它。
当我们想要在页面加载时不显示元素的情况下，我们可以使用CSS并设置display：none＆使用jQuery .hide（）。 如果我们打算切换元素，我们可以使用jQuery切换。
两者在所有浏览器上都是一样的，AFAIK。 检查Chrome和Firefox，都会在元素的style属性中添加display:none 。
如果使用基本的隐藏方法，请参阅没有区别。 但jquery提供了各种隐藏的方法，使元素的影响。 请参阅下面的链接，以获得详细的解释： 在JQuery中隐藏的效果
