jquery - 从 JSON 更新元素 CSS

Question

我试图在更新元素的 CSS 之前创建 JSON 对象，但 CSS 没有为元素更新。

我的代码：

var style = $.parseJSON("{\""  + attrName +  "\":\""  + $(this).val() +  "\"}");                                
elContainer.css(style);

Answer 1

你为什么要制作一个 JSON 字符串然后解析它，而不是仅仅制作一个 JS 对象？

这是你应该做的，除非我有误解：

var style = {};
style[attrName] = $(this).val();
eleContainer.css(style);

或者，如果您真的只是设置一个 CSS 属性，您可以按照@Nick 的建议进行操作，如下所示：

eleContainer.css(attrName, $(this).val());

顺便说一句，如果那是您的实际代码，那么您可能会收到错误，因为您缺少+连接器。

---

更新：

.css()是一组匹配元素的一次性设置。它不会创建适用于尚不存在的元素的永久 CSS 规则。

如果您想实际创建一个 CSS 规则而不是将某些 CSS 样式应用于一组特定元素，那么您可以动态创建一个<style>标签：

$("<style> .container { "+ attrName +": '"+ $(this).val() +"'; } </style>")
    .appendTo('body');

另请参阅：在运行时使用 jQuery 创建 CSS 规则/类

Answer 2

您可以设置单个 CSS 属性而无需创建对象，当然也无需解析 JSON：

eleContainer.css(attrName, $(this).val());