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

本文介绍了当在主样式表中设置时，myDiv.style.display返回空的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 Short Version：这是标准的行为，当 myDiv.style.display 在主样式表中，c> div 到 display：none ，但通过内联样式设置时返回none $ b 长版本： 我有一些 div 显示样式隐藏和取消隐藏，在和 none 。他们总是开始隐藏（ display：none ），因为我已经设置了内联样式： < div id =anIDclass =aClassstyle =display：none> stuff < / div> 以下是在 none 和块。两个chOpsXXX（）函数只是将 divSection.style.display 设置为相反的值（以及其他内务处理）： var divSection = document.getElementById（chOpsSection+ strSectionID）; var strDisplay = divSection.style.display; if（strDisplay ==none）{ chOpsDisplaySection（strSectionID）; } else { chOpsHideSection（strSectionID）; } 当我使用内联样式属性设置初始 display：none style。 我也在主样式表中为这些div设置其他样式。所以我决定将 display：none 的初始状态移动到所述样式表可能是有意义的。我这样做了。 但是当我这样做时， div （ display：none ），但是第一次调用 divSection.style.display 会返回一个空字符串 alert（strDisplay）; 返回一个空白字符串，而不是null）。 我上面显示的Javascript然后隐藏它（因为它不等于无），然后下一个调用 divSection.style.display 返回none，一切正常。 （如果我在主样式表中将它设置为 inline ，也会有同样的行为： div 是初始化可见的，到 divSection.style.display 返回一个空白字符串）。 这很容易解决， none和在我的Javascript上面。但我想知道如果从 divSection.style.display 返回一个空白字符串是标准行为。 如果你通过JS访问DOM元素（例如使用），那么你的所有回复都是受欢迎的。解决方案），您将无法读取该元素的计算方式，因为它在CSS文件中定义。要避免这种情况，您必须使用属性 getComputedStyle （或 currentStyle for IE）。 function getStyle（id，name） { var element = document.getElementById（id）; return element.currentStyle？ element.currentStyle [name]：window.getComputedStyle？ window.getComputedStyle（element，null）.getPropertyValue（name）：null; } 用法（ JSFiddle ）： var display = getStyle（'myDiv'，'display '）; alert（display）; //将打印'none'或'block'或'inline'等 Short Version: Is it standard behaviour that myDiv.style.display (Javascript) returns blank when I have set that div to display:none in a master stylesheet, yet returns "none" when it is set via an inline style? Long Version:I have some divs that I hide and unhide via their display style, toggling it with Javascript between block and none. They always start off hidden (display:none) which I have been setting with inline styles thusly:<div id="anID" class="aClass" style="display:none"> stuff</div>Here is the Javascript to toggle between none and block. The two chOpsXXX() functions just set the divSection.style.display to the opposite value (along with other housekeeping):var divSection = document.getElementById("chOpsSection" + strSectionID);var strDisplay = divSection.style.display;if (strDisplay == "none") { chOpsDisplaySection(strSectionID);} else { chOpsHideSection(strSectionID);}This all works fine when I use an inline style attribute to set the initial display:none style.I am also setting other styles for these divs in master stylesheet. So I decided it might make sense to move the initial state of display:none to said stylesheet. I did so. I won't post it, I think you can picture it.But when I did so, the div is initially hidden (display:none), but the first call to divSection.style.display returns an empty string (alert(strDisplay); returns a blank string, not null). My Javascript shown above then hides it (becaues it doesn't equal "none") and then the next call to divSection.style.display returns "none" and everything works fine from there. (Same behaviour if I set it to inline in the master stylesheet: the div is initialy visible, and the first call to divSection.style.display returns a blank string).This is easy enough to fix by checking for both "none" and "" in my Javascript above. But I would like to know if this returning of a blank string from divSection.style.display is standard behaviour.All replies are welcome. 解决方案 If you access to a DOM Element via JS(using for example getElementById) you'll not be able to read the computed style of that element, because it is defined inside the CSS file. To avoid this, you have to use property getComputedStyle(or currentStyle for IE).function getStyle(id, name){ var element = document.getElementById(id); return element.currentStyle ? element.currentStyle[name] : window.getComputedStyle ? window.getComputedStyle(element, null).getPropertyValue(name) : null;}Usage(JSFiddle):var display = getStyle('myDiv', 'display');alert(display); //will print 'none' or 'block' or 'inline' etc 这篇关于当在主样式表中设置时，myDiv.style.display返回空的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！