javascript - 类 CSS 属性返回

Question

如何返回一个类计算的 CSS 属性/属性数组？

比如，如果我在 CSS 中定义了一个类:

.global {
    background-color: red;
    color: white;
    text-shadow: 0px 1px 1px black;
}

它与 javascript 一起应用于 元素。现在我想将此 elements childrens color 更改为 parents (.global) 元素 background-color。

有没有办法从 style 标签或外部包含的 *.css 中先前定义的类中读取 CSS 属性？

类似于 getCSSData([span|.global|div > h1]);(其中传递的变量是 CSS 选择器，它获取完全匹配元素的数据)将返回一个对象每个属性都在它自己的可访问变量中？

类似于:

cssdata = {
    selector : '.global',
    properties : {
        backgroundColor : 'red',
        color : 'white',
        textShadow : '0px 1px 1px black'
        // plus inherited, default ones (the ones specified by W3..)
    }
}

我之前解释过的例子的用法是:

// just an example to include both, jQuery usage and/or native javascript
var elements = $('.global').children() || document.getElementsByClassName('.global')[0].children;
var data = $('.global').getCSSData() || document.getCSSData('.global');
return elements.css('color', data.properties.backgroundColor) || elements.style.backgroundColor = data.properties.backgroundColor;

javascript/jquery 中是否已经内置了一个函数，而我忽略了它？

如果没有，我应该寻找什么来制作一个？

附言也可以是 DOM Level 3..(HTML5'ish..)

Answer 1

如果您想获取父元素的背景颜色，然后将该颜色应用于所有子元素的字体，您可以使用以下代码。

$(document).ready(function(){    

    var global = $('.global');
    var bgColor = global.css('background-color');
    global.children().css('color', bgColor);

};

Here's an example on jsFiddle.net