简短版本:myDiv.style.display当我在主样式表中将(Javascript)设置div为空白时 ,它是否返回标准行为display:none,而通过内联样式进行设置时,则返回“无”?
myDiv.style.display
div
display:none
长版:
我有一些div通过display样式隐藏和隐藏的,并在block和之间使用Javascript进行切换none。它们总是从隐藏(display:none)开始,而隐藏()是我一直使用内联样式设置的:
display
block
none
<div id="anID" class="aClass" style="display:none"> stuff </div>
这是在none和之间切换的Javascript block。两个chOpsXXX()函数只是将设置divSection.style.display为相反的值(以及其他内部管理):
divSection.style.display
var divSection = document.getElementById("chOpsSection" + strSectionID); var strDisplay = divSection.style.display; if (strDisplay == "none") { chOpsDisplaySection(strSectionID); } else { chOpsHideSection(strSectionID); }
当我使用内联样式属性设置初始display:none样式时,这一切都很好。
我还在主样式表中为这些div设置其他样式。因此,我认为将的初始状态display:none移至所述样式表可能有意义。我是这样 我不会发布它,我想您可以想象它。
但是,当我这样做时,div最初是隐藏的(display:none),但是第一次调用divSection.style.display返回一个空字符串(alert(strDisplay);返回一个空字符串,而不是null)。
alert(strDisplay);
上面显示的我的Javascript然后将其隐藏(因为它不等于“ none”),然后 下一次 调用divSection.style.display返回“ none”,然后一切正常。(如果inline在主样式表中将其设置为相同的行为:div初始可见,并且第一次调用将divSection.style.display返回一个空白字符串)。
inline
通过在上面的Javascript中同时检查“ none”和“”,很容易修复。但是我想知道是否从divSection.style.display标准字符串返回空白字符串。
欢迎所有答复。
如果您通过JS(例如使用getElementById)访问DOM元素,则将无法读取该元素的 计算样式 ,因为它是在CSS文件中定义的。为了避免这种情况,您必须使用属性getComputedStyle(或currentStyle用于IE)。
getElementById
getComputedStyle
currentStyle
function getStyle(id, name) { var element = document.getElementById(id); return element.currentStyle ? element.currentStyle[name] : window.getComputedStyle ? window.getComputedStyle(element, null).getPropertyValue(name) : null; }
用法:
var display = getStyle('myDiv', 'display'); alert(display); //will print 'none' or 'block' or 'inline' etc