-1

I have a site that's maintained by a 3rd party. They will allow us to load our custom js file in the header so that we can manipulate the DOM as each page loads. I know how to swap out classes, etc. but I was curious if I can sniff for a HEX value and swap it out for another instead of adding classes here and there to do the same thing.

I don't want to this to one element (e.g. getElementByID or tag) I want it to swap out ALL instances of this variable. So if the CSS is: fred { color: #e3e3e3; } (and other classes are also using #e3e3e3) I want to be able to search for all instances of #e3e3e3 and change them to #d9d9d9. or something like that.

Thanks

careforapint
  • 1
  • 3
  • 1
    Yes you can. What have you tried so far though? Please post your attempt here and we'll help you from there. – AndrewL64 Nov 30 '18 at 19:45
  • 2
    yes, but why would you want to? If you can use your own js surely you can post your own css? – Katie.Sun Nov 30 '18 at 19:46
  • @Katie.Sun has a point though. – AndrewL64 Nov 30 '18 at 19:50
  • Yes you can. but tell us what you have tried untill now and where you're facing problem ? – Code Maniac Nov 30 '18 at 19:50
  • Please provide a [mcve] and a more specific code related problem description – charlietfl Nov 30 '18 at 19:51
  • I have not tried any code yet because I'm new to js and honestly haven't been very successful in my searches (why I turned to stackoverflow). I'm familiar with simple manipulations, like adding classes, get element by XXX, etc. I have linked to an external CSS (with my js file). I can see that it loads and my classes are there, but it appears that it's not loading properly in the stack because most of my updates are overwritten by the 3rd party's CSS. What js commands should I be researching to accomplish this? – careforapint Nov 30 '18 at 19:58

1 Answers1

0

If you are explicitly trying to modify the CSS instead of just adding either inline styles to an element or by adding your own style tag to the document with more specific CSS, you could technically do what you are asking, as answered by this other SO question.

I would recommend instead of that you either inline your CSS if you are targeting only a few DOM elements, or create a more specific CSS rule targeting the classes you want to change.

brianespinosa
  • 2,408
  • 12
  • 22