無法訪問元素樣式屬性

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";

我希望這有幫助。