JQuery - 显示/隐藏样式属性覆盖css

Question

我理解CSS是如何工作的，因为最接近元素的样式会覆盖任何以前的样式。我的问题是，如果为show()标记定义了样式属性，JQuery函数hide()和<div>如何运作：

<div class='menuTab' style="display:block">

为了这个例子，假设css类似于：

div.menuTab{
    /* ..other css...*/
    display:none
}

应用函数$('div.menuTab').hide()会将menuTab HTML的样式属性更改为display:none吗？

Answer 1

简而言之：是的。

.hide()是：

的简写

.css("display","none");

因此，它会使用display:block覆盖您的display:hidden内嵌样式。

除非使用!important，否则内联样式会覆盖CSS。

Answer 2

是

$('div.menuTab').hide()将导致style="display:none"

Answer 3

是，

它将隐藏类并覆盖其属性。

.hide()

是：

的简写

.css("display","none");

它会覆盖

 .css("display","block");

正如你在chrome的检查元素中看到的那样

Answer 4

如果你使用$('div.menuTab').hide(); js会将html中的样式字面改为display:none;

这里有一个例子。您可以看到.hide()功能会将显示从block更改为none。

http://jsfiddle.net/2tfuxzq5/3/

希望它有所帮助！

Answer 5

通过选中jQuery source（搜索：.hide()），您可以轻松找到function showHide的工作原理。

jQuery .hide()和.show()是jQuery.css()的包装器，根据其类型（style.display到.hide()和{更改元素的display = 'none'属性{1}}至.show()，'inline'等）。