0

Hello I am changing dynamically the css of a website: Suppose we have a div:

<div id="fooid" class="fooclass" ></div>

with class fooclass and id fooid element and we get its background using:

var bgcolor = element.css( "background-color" );

My Problem is that I cannot tell of that bgcolor is set in the fooid css or in the fooclass is there anyway to find that out? thank you in advance

James
  • 1
  • 1
  • 3
    [The XY-problem](https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem) – Yury Tarabanko Dec 09 '18 at 09:51
  • I'm trying to understand the use case for this type of problem. What scenario would you need to derive an element's original source for a particular style? CSS is either pre-defined in a standard file, or is styled inline on-the-fly using javascript. In other words, you're usually supposed to know where and when a style is applied/used. – Keno Dec 09 '18 at 09:56
  • What are you actually trying to do? Get the value of `background-color` of a certain element? – Kresimir Dec 09 '18 at 09:57
  • 1
    You could create an element with just one of the selectors and check the computed css value of that element. – maioman Dec 09 '18 at 10:02
  • I don't think that you can be enable of know which specific CSS rule is applied and where it come from on javascript. The CSS painting process doesn't have a way to indicate that information when is applied to an element. That's why the element doesn't know which rule is applied for background-color, the element only know what is the last specific rule valye – Miguel Angel Dec 09 '18 at 10:11
  • I do not want to use inline css but rather override the css or id in the class. @ kresimir I want to know if the background-color value is set in the class css or in the id css – James Dec 09 '18 at 10:33
  • you don't need to know from where it comes to override it, simply add another class and increase the specificity or use important, etc ... – Temani Afif Dec 09 '18 at 10:53
  • @ Temani I know I can override it but I want to know where it is set. – James Dec 09 '18 at 12:50

2 Answers2

0

One way to find out is to use chrome's developper tools. You can inspect your div and look of the background is set using the class or the id in your styles tab. The background will be set there and you can see by what.

Courtney Mill
  • 39
  • 4
0

Get the selectors from this answer :

Find all CSS rules that apply to an element

and then match the value with Window.getComputedStyle of background-color of your element.

Arnab Ghosh
  • 333
  • 1
  • 2
  • 10