Question

是否有可能获得div中存在的具有特定类及其子元素的所有颜色值？

例如，我有：

<div class="row client">
<a href="somepage.php" style="color:#515151;">Link1</a>
<span style="color:#f3f3f3;">Span</span>
<h3 style="color:#ff00ff;">Subtitle</h3>
</div>

我想要一个数组来获取所有颜色：

background of the parent div
color of the <a> element
color of the <span> element
color of the <h3> element

另外，我正在使用highcharts在同一个div中显示图表。是否有可能获得那里使用的颜色？

我认为我不能把这个更清楚地告诉你们，

非常感谢！

工作

Answer 1

您可以使用：

var colorarray=[];
$('.client').children().addBack().each(function(){
  if(!$(this).is('.client'))
     colorarray.push("color of the <" +$(this).prop("tagName")+"> is "+ $(this).css('color'))
  else
     colorarray.push("background of <" +$(this).prop("tagName")+"> is "+ $(this).css('backgroundColor'))
})

<强> Working Demo

如果您想要十六进制的颜色，可以参考此https://stackoverflow.com/a/1740716/1719752

Answer 2

你可以循环遍历div中的所有元素

Fiddle

var elements =  $(".client").children()

$(elements).each(function(index) {
  console.log( index + ": " + $(this).css("color"));
});

Answer 3

这是一个相当低效但我认为没有库的易于理解的方法：

stdin

使用jQuery / JS从div获取所有颜色

3 个答案: