如何使用自己的数据属性设置 css 属性？答案

【问题标题】：How to set the css properties with its own data-attributes?如何使用自己的数据属性设置 css 属性？
【发布时间】：2012-05-15 03:08:59
【问题描述】：

假设我有这个小sn-p：

<p data-color="red">Hello world</p>

我想将其颜色设置为自己的数据属性，如下所示：

$('p').css({

    color: $(this).data('color')
});

由于某种原因，这不起作用。有人知道我做错了什么吗？

【问题讨论】：

【解决方案1】：

this 指的是别的东西，而不是p。试着把它放在一个函数中。

$('p').css('color', function() { return $(this).data('color'); });

【讨论】：

【解决方案2】：

$('p').css('color', function() {
    return $(this).data('color');
});

【讨论】：

【解决方案3】：

您可以在设置 css 属性之前将整个数据存储在一个对象中以避免循环。类似的东西：

var $p = $('p'),
    data = $p.data();

$p.css({
    color: data.color,
    fontSize: data.fontSize
});

【讨论】：