如何使用JS設置元素的不透明度？

Question

我知道如何在樣式表中進行設置。 這說明了如何使用JS獲取它...

我試圖這樣做：

window.getComputedStyle( myEl ).setPropertyValue( 'opacity', 0.7 );

並得到

setPropertyValue不是函數。

顯然，我可以在min.js文件中使用JQuery css( ... ) ...，我發現opacity匹配項不少於10個。 我對發生的事情一無所知。

順便說一下，這是Firefox。

Answer 1

通過修改style屬性。

myEl.style.opacity = 0.7;

Answer 2

這是不透明度更改的實時示例：

 var target = document.getElementById('target'); var currentOpacity = window.getComputedStyle(target).opacity; function decreaseOpacity() { if (currentOpacity > 0) { target.style.opacity = currentOpacity - 0.1; currentOpacity -= 0.1; } } function increaseOpacity() { if (currentOpacity < 1) { target.style.opacity = currentOpacity - 0.1; currentOpacity += 0.1; } } 

 #target { width: 100px; height: 100px; background-color: violet; opacity: 1; } 

 <div id="target"></div> <button onclick="decreaseOpacity()">Decrease opacity</button> <button onclick="increaseOpacity()">Increase opacity</button>