将变量用于 jquery CSS 属性名称

use variable for jquery css property name

本文关键字：属性 CSS jquery 变量 用于      更新时间：2023-09-26

我已经看到很多线程询问如何将变量用于jquery的css方法，例如

var black='#000000';
$(this).css({'color':black});

但是没有一个如何反过来使用变量

var bg='background-color';
$(this).css({bg:'#000000'});

对我来说，它不是那样工作的，所以我问，有没有办法让这样的东西工作，在脚本中多次使用"背景色"时节省一些空间？

谢谢！

如果它是一个单一的属性，你可以这样写

var bg = 'background-color';
$(this).css(bg, '#000000');

如果需要传递对象，可以将background-color键定义为方括号内的变量 

var bg = 'background-color';
var obj = {};
obj[bg] = '#000000';
$(this).css(obj);

使用bracket表示法将变量用作对象的key

var obj = {};
var bg = 'background-color';
var black = '#000000';
obj[bg] = black;
$('div').css(obj)
div {
  color: white;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div>Hello</div>

只需使用采用样式名称和参数的 .css（属性名称，值） 版本

$('div').each(function() {
  var bg = 'background-color';
  $(this).css(bg, '#000000');
})
div {
  margin-bottom: 5px;
  color: white;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>some</div>
<div>test</div>

相关文章：