将“值”从滑块传递给元素，作为属性的参数

Question

我正在尝试捕获一个HTML slider value，它假设设置属性的参数（在CSS类内）。所以，我有一个slider和一个div元素 - 我想将一个值传递给：<input type="range" min="1" max="11" value="6" class="slider" id="slider"><div id="container">     <div id="fg2">text</div></div>在 JS 中，我将这两个元素设置为变量，并添加Event Listener到, 并使用从slider中捕获的函数：valuesliderconst slider = document.getElementById("slider")const FGElement = document.getElementById("fg2");slider.addEventListener("input", function(){    changeSize();});function changeSize() {    let i = slider.valueAsNumber;    console.log(i);}现在，我想在其中添加一个类FGElement，我将在其中放置flex-grow: [i]. 这是我如何动态捕获value从slider到的想法FGElement。如果是这样的话，这是正确的方法吗 - 如何CSS class attribute在 JS 中设置参数？如果没有，正确的方法是什么...

Answer 1

您不能动态更改.css文件的值

您必须使用 JS 来应用内联样式

document.getElementById('myElement').style.flexGrow = i;