jquery - JQuery - 在选择器中获取 css 属性

Question

我正在尝试为目标元素的 CSS 属性（字体大小）设置自定义属性。如何从选择器中访问 c​​ss，例如：

$('.font-900').attr('data-resfont', <font-size here>);

我试过：

$('.font-900').attr('data-resfont', this.css('font-size'));

我猜这不起作用，因为“this”指的是 attr 函数。我的下一步是：

$('.font-900').attr('data-resfont', this.target.css('font-size'));

这似乎也不起作用。我想我错过了一些简单的东西。

Answer 1

有多种方法可以做到这一点：

• 遍历每个匹配的元素：

$('.font-900').each(function() {
    $(this).attr('data-resfont', $(this).attr('font-size'))
});

• 创建变量赋值：

var e = $('.font-900');
e.css('data-resfont', e.attr('font-size');

• 使用函数设置属性

$(".font-900").attr('data-resfont', function () {
   return this.style.fontSize;
});

Answer 2

您可以使用一个函数作为第二个参数，.attr该函数在集合中的每个元素上进行迭代（您不能这样做，.data否则我会建议使用它）。

$(".font-900").attr('data-resfont', function () {
    return this.style.fontSize;
});