gpt4 book ai didi

css - getComputedStyle 返回 CSSStyleDeclaration 但访问时所有属性均为空

转载 作者:技术小花猫 更新时间:2023-10-29 11:02:55 25 4
gpt4 key购买 nike

我有一个简单的 div,它使用一个 css 类,该类又具有 colorbackground-color 属性集。

var div = document.createElement("div");
div.classList.add("my-css-class");
container.appendChild(div);

//This prints out a CSSStyleDeclaration object. This is a large object to which I see `color` and `backgroundColor`
console.log(getComputedStyle(div));

//this gives me an empty string
console.log(getComputedStyle(div).color);

//this gives me an empty string
console.log(getComputedStyle(div).getPropertyValue("color"));

为什么我无法访问 CSSStyleDeclaration 的属性?我从我的第一个日志中知道它在那里。我可以看到 color: "rgb(82, 194, 145)"

最佳答案

最终,getComputedStyle 的问题在于,所讨论的元素似乎必须是 DOMTree 的一部分才能使任何样式可用。

请注意,在我的例子中,我将 div 添加到父容器中,但是,实例化时的父容器尚未添加到 DOMTree 中。

我未能使用 JSON.stringify() 打印对象,这意味着值稍后出现,但在访问时为空白。

所以基本上,我暂时将 container.appendChild 更改为 document.body.appendChild 以立即计算我需要的样式,然后将其删除并销毁它离开我只是我需要的颜色。

关于css - getComputedStyle 返回 CSSStyleDeclaration 但访问时所有属性均为空,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35360711/

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