是否可以检查元素的 CSSdisplay == block或none使用 JavaScript？
使用 JavaScript 检查元素 CSS 显示
IT技术
javascript
css
2021-01-22 07:53:12
6个回答
正如下面 sdleihssirhc 所说，如果元素display被继承或由 CSS 规则指定，则需要获取其计算样式：
return window.getComputedStyle(element, null).display;
style如果样式是内联声明的或使用 JavaScript 声明的，元素有一个属性会告诉你你想要什么：
console.log(document.getElementById('someIDThatExists').style.display);
会给你一个字符串值。
如果样式是内联声明的或使用 JavaScript 声明的，则可以直接获取style对象：
return element.style.display === 'block';
否则，您将不得不获取计算样式，并且存在浏览器不一致的情况。IE 使用一个简单的currentStyle对象，但其他人都使用一个方法：
return element.currentStyle ? element.currentStyle.display :
getComputedStyle(element, null).display;
将null被要求在Firefox 3及以下版本。
对于jQuery，你的意思是这样吗？
$('#object').css('display');
你可以这样检查：
if($('#object').css('display') === 'block')
{
//do something
}
else
{
//something else
}
这个答案并不完全是您想要的，但在某些情况下可能有用。如果你知道元素在显示时有一些尺寸，你也可以使用这个：
var hasDisplayNone = (element.offsetHeight === 0 && element.offsetWidth === 0);
编辑：为什么这可能比直接检查 CSSdisplay属性更好？因为您不需要检查所有父元素。如果某个父元素有display: none，它的子元素也被隐藏，但仍然有element.style.display !== 'none'。
是的。
var displayValue = document.getElementById('yourid').style.display;