gpt4 book ai didi

javascript - 为什么 javascript 样式属性没有按预期工作?

转载 作者:行者123 更新时间:2023-11-30 13:01:29 24 4
gpt4 key购买 nike

<html>
<head>
<style type="text/css">
#wow{
border : 10px solid red;
width: 20px;
height: 20px;

}
</style>
</head>
<body>
<div id="wow"></div>
<script>
var val = document.getElementById("wow");
alert(val.style.length);
</script>
</body>
</html>

这是我的代码,为什么val.style.length是0?因为我定义了3个属性,所以我期望是3

最佳答案

元素的 style 属性只反射(reflect)内联样式。它本质上是一种获取(实际上是设置)内联样式的方法。

来自 MDN :

[the style property] is not useful for learning about the element's style in general, since it represents only the CSS declarations set in the element's inline style attribute, not those that come from style rules elsewhere, such as style rules in the section, or external style sheets.

您可以使用 window.getComputedStyle(element) 获取应用于元素的所有样式:

alert(window.getComputedStyle(val).length);

但是,这可能不会如您所愿,因为它提供了元素的所有 样式属性,即使它们仍然是默认值。在我的浏览器(Chrome、FWIW)中,这意味着它总是返回 285。这应该不足为奇。毕竟,浏览器有一个“内置”样式表,它为所有元素提供默认值。

关于javascript - 为什么 javascript 样式属性没有按预期工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17302386/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com