0

In JavaScript/DOM there's getComputedStyle to get access to all the computed style properties of a given element and then there's getComputedStyle(...).getPropertyValue(...) the get the actual value of a computed style property.

But how do I get the names of all involved custom properties (those that start with '--')? TYVMIA

Natasha
  • 516
  • 7
  • 24
  • 1
    Based on [this question's answers](https://stackoverflow.com/questions/48760274/get-all-css-root-variables-in-array-using-javascript-and-change-the-values), it seems there's no easy way. Instead, you'd have to dig through the stylesheets themselves. – Ouroborus Feb 05 '22 at 07:01
  • You can get all the CSS variables that are available for that element through getComputedStyle, but it depends on what is meant by ‘involved’. They may or may not be being actually used in the styling. – A Haworth Feb 05 '22 at 12:27
  • @AHaworth With "all involved variables" I mean "all custom properties that are set in the context of the given element". Please find here a non-working demo: codepen.io/natasha42/pen/podNzaE (ouput should be: --some-prop) – Natasha Feb 05 '22 at 13:10
  • Filter produces an array not a string. – A Haworth Feb 05 '22 at 16:33
  • @AHaworth, of course your are right, my bad. I meant "... (output should be: `['--some-prop']`)". I want an array of all the names of the (in the context/subtree) involved custom properties. – Natasha Feb 06 '22 at 05:28

0 Answers0