Javascript 如何在html元素中调用css类作为函数？

如何实现将css类作为函数调用？我不想为每个宽度值生成类？有没有像下面这样的解决方案

我正在尝试根据后端代码更新样式的宽度值 （宽度表示产品的数量）

.dynamicWidth（@param）{
宽度：@param-px；
}

我可以通过使用内联样式代码来解决这个问题，但我不想使用内联样式代码，因为内容安全策略

//I don't want to use it like this.

<style>
  .dynamicWidth{
        dynamicWidth:var (--param);
  }
</style>
<div class="dynamicWidth" style="--param : 40;"></div>

//我不想这样使用它。
.动态宽度{
动态宽度：var（--param）；
}

您可以使用javascript执行此操作：

var elements=document.getElementsByClassName（“dynamicWidth”）；
数组.from（元素）.forEach（（元素）=>{
element.style.width=element.getAttribute（“数据宽度”）+“px”；
});
.dynamicWidth{
高度：20px；
背景：红色；
}

style=“width:XXpx；”但这不是一个好主意（您应该知道您使用的元素的宽度），您不能在html中使用css类作为函数。您可以使用JQuery函数来实现task@PavelTřupek我不想使用内联style@HardikLeuwa我可以使用LESS或SCSS实现它吗？您可以使用数据属性（
数据宽度
）而不是类属性吗？会安全得多。令人印象深刻，但在实践中非常脆弱。如果在类值中添加了任何其他内容（故意添加或通过后端或JS库添加），则为kablooey。
//I don't want to use it like this.

<style>
  .dynamicWidth{
        dynamicWidth:var (--param);
  }
</style>
<div class="dynamicWidth" style="--param : 40;"></div>