CSS类属性返回

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

一样，如果我在CSS定义的类：

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

它在使用JavaScript去一个element应用。现在我想改变这种elements儿童color到父母（.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建已经是一个功能，我我忽视了它？

如果不是，我应该找什么来制作一个？

P.S.可DOM Level 3的太..（HTML5'ish ..）

来源

2011-09-22 jolt

可以访问其包括所有继承样式值，这里的元件的computedStyle是输出在控制台div元素的计算样式示例。

<script type="text/javascript"> 
    if (document.addEventListener) { 
     document.addEventListener("DOMContentLoaded", listComputedStyles, false); 
    } 

    function listComputedStyles() { 
     var element = document.getElementById("myDiv"); 
     var properties = window.getComputedStyle(element, null); 

     for (var i = 0; i < properties.length; i++) 
     { 
      var value = window.getComputedStyle(element, null).getPropertyValue(properties[i]);    
      console.log(properties[i], value); 
     } 
    } 

</script> 

<div id="myDiv" style="background-color: blue; height: 500px;"></div>

您可以在这里找到更多的信息：http://help.dottoro.com/ljscsoax.php

来源

2011-09-22 20:31:33

如果你想抓住的父元素的背景颜色，然后将该颜色应用到它的所有的字体的孩子，您可以使用下面的代码。

$(document).ready(function(){  

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

};

Here's an example on jsFiddle.net

来源

2011-09-22 20:22:24

这只是一个值，正如我在问题中提到的那样，我想用单个命令获取所有值。你不能用'* .css（）;'来完成。 – jolt

你想获得所有的价值？ –

如果我正确理解你的问题，你想找到一个通用的方法来修改类;并且修改会影响该类的所有实例。这是关于SO over here的另一个详细讨论的主题。

还有的竟然是班一个非常有趣和有用的治疗，工作在几乎所有的浏览器，特别是除外IE8及以下。

来源

2011-09-22 20:33:14

嗯，其实我想检索类属性，但所有的EM'，默认的，计算出来的等等，所以我可以在以后使用这些..但看起来像邮件中包含一个有用的信息，引导我进入正确的方向。 – jolt

CSS类属性返回

回答

相关问题