1

(How) is it possible to select elements based on their style attribute?

Thanks to the this question, we know it is impossible using pure css.

To enlight the issue, i give my concrete case: i want to change background color of all p and spans with background color white in a div to transparent.

Does angular some favor about it? Or what else can be used?

Community
  • 1
  • 1
Asqan
  • 4,319
  • 11
  • 61
  • 100
  • dont use jquery selectors at all. use angulars awesome feature directives – sundar Jan 09 '16 at 22:59
  • directives are write once use anywhere for anything – sundar Jan 09 '16 at 23:00
  • Why can't you use classes for this? Trying to parse colors from DOM returns different formats in different browsers. Provide more details about your specific issue – charlietfl Jan 09 '16 at 23:01
  • angular should not have selectors at all – sundar Jan 09 '16 at 23:01
  • since html files are external, i have no control about them @charlietfl And if i encapsulate them using a class, i still can't select the ones with a certain background color – Asqan Jan 09 '16 at 23:10

2 Answers2

0

window.getComputedStyle()

var divs = document.querySelectorAll('div');

[].slice.call(divs).forEach(function(div) {
  var color = window.getComputedStyle(div, null).backgroundColor;

  if (color === 'rgb(255, 255, 255)') {
    div.style.backgroundColor = 'transparent';
  }
});

You'll need to normalize the colors since different browsers return it in different formats.

JSFiddle demo: https://jsfiddle.net/ebq6manb/1/

Miguel Mota
  • 20,135
  • 5
  • 45
  • 64
  • you should not use this in angularjs – sundar Jan 09 '16 at 23:03
  • @sundar why not? it seems it solves the problem although angularjs is not used. I have still no idea whether it can be solved using angular its "directives" – Asqan Jan 09 '16 at 23:08
  • @Asqan you cant use anything to solve ur problem.so if you want to do in native way then why did u come to angularjs if you are going to use angular u should do it in angular's way.angular is not meant for doing this kind dom manipulations – sundar Jan 09 '16 at 23:12
  • @Asqan learn about angulars test driven system.and docs for reference – sundar Jan 09 '16 at 23:14
  • @sundar that's a silly statement ... angular is javascript – charlietfl Jan 09 '16 at 23:22
  • @charlietfl oh really man thanks for the update.read angular's test driven system and you'll accept my statement – sundar Jan 09 '16 at 23:23
  • @charlietfland also read about reusable components and why directives are being used in angular – sundar Jan 09 '16 at 23:26
  • @sundar nobody is saying this is being used in directive..that is the proper place to use it – charlietfl Jan 10 '16 at 01:54
-1

You could grab all the divs with a selector, iterate through them, use the attr('style') method and then do a check to see what background color they are.

Araymer
  • 1,315
  • 1
  • 10
  • 16