Javascript myDiv.style.display在主样式表中设置时返回空白

短版本：当我在主样式表中将

div

设置为

display:none

时，

myDiv.style.display

（Javascript）返回空白，而通过内联样式设置时返回“none”，这是标准行为吗

长版本：

我有一些

div

s，我通过它们的

display

样式隐藏和取消隐藏它们，用Javascript在

block

和

none

之间切换。它们总是以隐藏开始（

display:none

），这是我用内联样式设置的：

<div id="anID" class="aClass" style="display:none">
   stuff
</div>

当我使用内联样式属性设置初始的

display:none

样式时，这一切都可以正常工作

我还在主样式表中为这些div设置其他样式。因此，我决定将

display:none

的初始状态移动到所述样式表可能是有意义的。我这样做了。我不会发布它，我想你可以想象它

但是当我这样做时，

div

最初是隐藏的（

display:none

），但是第一次调用

divSection.style.display

返回一个空字符串（

alert（strDisplay）；

返回一个空字符串，而不是null）

上面显示的Javascript随后将其隐藏（因为它不等于“none”），然后下一次调用

divSection.style.display

返回“none”，一切正常。（如果我在主样式表中将其设置为

inline

，则行为相同：

div

初始可见，第一次调用

divSection.style.display

返回一个空白字符串）

通过在我上面的Javascript中同时检查“none”和“”，可以很容易地解决这个问题。但是我想知道从

divSection.style.display

返回一个空白字符串是否是标准行为

---

欢迎所有回复。

它不起作用，因为您将其作为元素上的

样式

属性删除，并将其放置在外部样式表中。DOM不会显示文档对象中不存在的属性值（DOM只是一个逐字读取HTML文档的XML解析器）

要查找外部样式表中设置的CSS值，必须解析

document.styleSheets

并找到匹配的选择器

这就是使用像

jQuery

这样的库变得非常方便的地方，因为它解析外部样式表，并且有助手方法来获得应用于元素的完整CSS

在jQuery中执行此操作的示例：

value = $("#anID").css("display");

---

PS-查找空字符串也不适用，因为display:“”与display:“none”不同（事实上，对于div，它与display:block相同，因为空白本质上意味着

inherit

）

如果您通过JS访问DOM元素（例如使用

getElementById

）您将无法读取该元素的计算样式，因为它是在CSS文件中定义的。为了避免这种情况，您必须使用属性

getComputedStyle

（或IE的

currentStyle

）

用法（）：

---

javascript显示属性仅代表DOM属性

，返回表示元素的样式属性的对象

，样式对象表示一个单独的样式语句

您可以使用jquery的方法获得混合显示值，如

alert($("#foo").css("display"))

即使您使用css设置它，它也应显示“无”：

创建类

。隐藏

.hidden {
   display: none !important;
}

Javascript:

function toggleHidden(id) {
    var x = document.getElementById(id);
    x.classList.toggle('hidden');
}

样式是在CSS中定义的吗？或者放入HTML标记中？在方案一中，效果如预期，HTML标记中设置了
display:none
。在我不理解的场景2中，css文件中设置了
display:none
。我希望我在上面使用了正确的术语。@John F，你能更新你的问题吗？如果你对涉及或不涉及框架的解决方案感兴趣的话？我确实觉得有必要在这里证明否决票的合理性。Thanks@Alexb对不起，投票被否决了。我欢迎所有回复。老实说，你的回答中最有用的部分是关于发生了什么的解释的链接。Jquery片段是锦上添花。这是我的答案的一个副本，并提供了一个Jquery示例。@LightStyle，是的，我提到了“你可以使用Jquery”@alex，你没有用这个答案添加任何有用的内容。@Steven Moseley，“副本”？我不是英国人，我应该像抄袭你的答案一样阅读这篇文章？我发现这篇文章中的链接有助于理解我做错了什么。嘿@LightStyle-你是说
element.currentStyle[name]
而不是
x.currentStyle[styleProp]
？+1吗。谢谢你的回复。你教了我一些新东西。
alert($("#foo").css("display"))

.hidden {
   display: none !important;
}

function toggleHidden(id) {
    var x = document.getElementById(id);
    x.classList.toggle('hidden');
}