无法访问元素样式属性

Question

我想更改我的“文本”变量的一些 styles 但不知何故不能。

const bg = document.querySelector(".bg");
const text = document.querySelector('.loading-text');


let count = 0;

let interval = setInterval(blurr,30);

 function blurr() {
    if(count>99) {
        clearInterval(interval);
    }
    text.innerHTML = `${count}%`;
    text.style //here is the problem
    count++;
};

我是新来的，也是 javascript 的新手，所以 go 请放轻松：|

Answer 1

关于元素样式，你想做什么？ 您是要获取当前值还是要设置它？

为了获得一些 CSS 样式属性，您可以执行以下操作：

var color = text.style.color;

如果您尝试设置/更改它，您可以执行以下操作：

test.style.color = 'green'; 

有关详细信息，请参阅此文档： https://www.w3schools.com/js/js_htmldom_css.asp

编辑：据我所知，OP 正在尝试设置元素的不透明度。

text.style.opacity = 0.01 * count;

在这里看到这个工作： https://jsfiddle.net/84pohswj/

但如果是这种情况，我建议您改用 CSS 动画。 有更好的选择。 并用JS给animation class赋值： https://www.w3schools.com/css/css3_animations.asp

Answer 2

如果你想改变你的不透明度为 0.5 这里是代码

text.style.opacity = "0.5";

我希望这有帮助。