使用 jQuery 获取 class 值

Question

给定一个 class .test{color:red;....}，我如何使用 javascript 获取样式属性？

Answer 1

如果你想获取带有 class 的元素的标题，那么它类似于下面的代码...

jQuery代码

$(selector).attr(attribute);

如果你想获得内联样式，那么使用

$(".test").css('style');

在此之后，您需要根据分隔符解析字符串和基础。然后你将得到 css 属性的键/值对。

以同样的方式如果你想获得 css 属性然后

jQuery代码

$(selector).css(proprerty);

$(".test").css('width');

演示： http://jsfiddle.net/s2xcmsvx/

Answer 2

我假设您需要这些属性，即使 class 目前不存在，请考虑以下事项：

用那个 class 即时创建一个元素
获取其样式
再次删除

示例：

$('document').ready(function()
{
    var $bar, styles,
        markup = '<div class="foo" id="bar"></div>';

    // add a temporary element
    $('body').append( markup );

    // get element
    $bar = $('#bar');

    // get style with jQuery.css
    console.log( $bar.css('margin') );

    // or: Get all computed styles
    styles = getComputedStyle( $bar[0] );

    // all computed styles
    console.log( styles );
    // read out the one you want
    console.log( styles.margin );

    // for more see 
    // https://developer.mozilla.org/en-US/docs/Web/API/Window.getComputedStyle

    // remove the element again
    $bar.remove().detach();
});

Fiddle

使用 jQuery 获取 class 值

get class values with jQuery

jquery

class