javascript - 通过 elem.style.somestylingproperty 等 JS 变量选择 css 属性

<分区>

感谢您花时间阅读我的小问题! 所以我想做的是，我目前正在制作一个 JSON 对象，其中包含我对某些元素的所有样式。我将所有样式都放在 JSON 文件中的原因是我希望能够轻松实现新的自定义“仪表”，每个仪表都有自己独特的样式。

在这里您可以看到我的 JSON Obj 和试图从 JSON Obj 设置键的 javascript。

杰森对象: “米”:[{ “大奖”:{ “位置”:“固定”， “宽度”:“400px”， "高度": "250px", “白颜色”， } }, { “somethermeter”:{ “测试”:“伪造” } }],

Javascript 尝试设置 CSS 属性 + 值:

//returns the newly created meter
  meter: function(options) {
     console.log("----------new elem----------");
     var elem = document.createElement("div");

     //Set styling options.
     for (var mtr in options) {
        if (options.hasOwnProperty(mtr)) {
           for (var name in options[mtr]) {
              if (options[mtr].hasOwnProperty(name)) {
                 var styleProperty = name.toString();
                 var styleValue = options[mtr][name].toString();

                 elem.style.styleProperty = styleValue;

                 console.log(styleProperty);
                 console.log(styleValue);
              }
           }
        }
     }
     return elem;
  },
  textbox: function() {

  },

感谢阅读，希望对您有所帮助!

最佳答案

如果您想以编程方式添加样式属性，请使用括号:

elem.style[styleProperty] = styleValue; <- i.e: styleValue = 'fixed'
           ^
           |_ Variable styleProperty, i.e: styleProperty = 'position'

片段说明

let position = 'position';
document.getElementById('div').style[position] = 'fixed'
console.log(document.getElementById('div').style.position);

<div id='div'></div>

关于javascript - 通过 elem.style.somestylingproperty 等 JS 变量选择 css 属性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48818053/

上一篇：css - 鼠标悬停时如何在按钮中只制作粗体文本？

下一篇：html - 如何在容器内制作全宽div

javascript - $(...).tooltip 不是 Rails 6 webpack 的函数

c# - HTML/CSS 打印功能

html - 全高侧边栏和内容区域在较小的设备屏幕上中断

javascript - dimple.js 显示 X 轴标签，但如果 "value"为空，则不要在图表上放置圆圈

javascript - 从 Facebook 群组中选择最喜欢的帖子

jquery - 无序列表的最后一个元素在页面底部被截断 [New Issue]

html - "Centering"带有 Bootstrap 网格的图像

javascript - 如何重载 JavaScript 函数？ (更改 Slickgrid 的编辑器)

javascript - npm ERR 拒绝在名为 <packageName> 的包下安装名称为 <packageName> 的包