我正在尝试读取显示值（ display：none; 或 display：block; ）来自JavaScript的div（div id =navmenu）。但是当我在相同的html文件中设置样式值时，我能够阅读，但是当我在链接的CSS样式表中设置样式值时，它不会读取（结果只是空白）。
I'm trying to read display value (display:none; or display:block;) of a div (div id="navmenu") from JavaScript. But when I set the style values in same html file I'm able to read, but when I set the style values in the linked CSS style sheet it does not read (result is just blank).
<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="styles.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="navmenu"> <p>This is a box of 250px * 250px</p> </div><!--navmenu--> <!-------------------------------------------------------------------> <script> function display(elem) { return elem.style.display; } alert(display(document.getElementById('navmenu'))); </script> <!-------------------------------------------------------------------> </body> </html>
和css
and css
#navmenu { display:block; width:250px; height:250px; background-color:#3CC; }推荐答案
elem.style.display 属性仅报告直接在DOM对象上设置的显示属性。它不会报告从样式表继承的样式。
The elem.style.display property only reports a display property that is set directly on the DOM object. It does not report a style that is inherited from a style sheet.
要获取样式值，包括样式表中的样式值，可以使用 window.getComputedStyle（）
To get a style value including those from a style sheet, you can use window.getComputedStyle().
function display(elem) { return getComputedStyle(elem, null).getPropertyValue("display"); }更多推荐
我的CSS值不反映我的JavaScript中的值
发布评论