jQuery 的 .hide() 和设置 CSS 以显示之间的区别:无
2022-08-30 02:39:13
我最好做哪一个? 比写出来更快,但是有什么区别,它们实际上对HTML元素做了什么?.hide()
.css("display", "none")
我最好做哪一个? 比写出来更快,但是有什么区别,它们实际上对HTML元素做了什么?.hide()
.css("display", "none")
从关于 .hide() 的 jQuery 页面:
“匹配的元素将立即隐藏,没有动画。这大致相当于调用.css('display', 'none'),不同之处在于 display 属性的值保存在 jQuery 的数据缓存中,以便稍后可以将 display 恢复到其初始值。如果元素的显示值为内联,则隐藏并显示,它将再次以内联方式显示。
因此,如果能够恢复到 以前的值很重要,则最好使用 ,因为这样可以记住以前的状态。除此之外,没有区别。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>