javascript - 将 .css() 中的变量与 Jquery 一起使用

Question

我遇到了一个我似乎无法解决的相当奇怪的问题。我试图在 .css() 中使用一个变量，但它不起作用。但是，如果我直接在 .css() 调用中输入“背景颜色”，它会这样做。是什么赋予了？

var css = that.data('css');
var targets = that.data('targets');
var value = that.val();
console.log(css + ' ' + targets + ' ' + value);
console.log(css === 'background-color');
    // returns true

$(targets).css({
    css: value
});
// Doesn't work!

$(targets).css({
    'background-color': value
});
// Works ok!

Answer 1

您不能将变量用作对象文字中的键，请先创建对象，然后使用括号表示法添加属性

    var obj = {};
    obj[css] = value;
    $(targets).css(obj);

或者干脆

    $(targets).css(css, value);

Answer 2

您不能将变量用作对象文字中的标识符。使用{ css: value }创建一个具有名为 属性的对象css，它不使用变量css。

创建一个对象并设置属性：

var o = {};
o[css] = value;
$(target).css(o);

Answer 3

这也有效。尝试删除 .css() 中的花括号并使用逗号而不是冒号。

   var css = 'background-color';
    var targets = '#hellowhat';
    var value = '#000';


 $(""+ targets +"").css(
        css, value);