0

I working in some project.

I need get all classes with styles of any html element

Example

Element:

<a href="#" class="btn btn-transparent-white font-weight-bold py-3 px-6 mr-2">
    Agregar Medicamento
</a>

Code JS

var classes = e.target.className.split(' ');

console.log(classes);

Result:

["btn", "btn-transparent-white", "font-weight-bold", "py-3", "px-6", "mr-2"]

With my code I can get styles of classes

.btn
transition: color 0.15s ease 0s, background-color 0.15s ease 0s, border-color 0.15s ease 0s, box-shadow 0.15s ease 0s;

.font-weight-bold
font-weight: 500 !important;

.py-3
padding-bottom: 0.75rem !important;

.px-6
padding-left: 1.5rem !important;

.btn-transparent-white
undefined

But I have a problem with combined styles for example

.btn.btn-white-transparent

Any idea how I can to search any coincidences of element?

Edited:

Thanks for you anwers but I can search single classes , my problem is when I want to search .btn-white-transparent. this is a combined style,

I want to seach .btn-white-transparent and the anwer will be .btn.btn-white-transparent { color:#FFF}

dale landry
  • 7,831
  • 2
  • 16
  • 28
José Luis Alonso
  • 19
  • 1
  • 2
  • 2
    Does this answer your question? [How do you read CSS rule values with JavaScript?](https://stackoverflow.com/questions/324486/how-do-you-read-css-rule-values-with-javascript) – evolutionxbox Mar 06 '21 at 18:46
  • 1
    FYI if you want all the classes, just use `e.target.classList`. – Barmar Mar 06 '21 at 18:51
  • That helps to search for an element for example .btn, my problem is when I want to search for .btn-white-transparent as it does not exist alone, it is combined with another, like this .btn.btn-white-transparent and I don't know how to search for it – José Luis Alonso Mar 06 '21 at 18:53

0 Answers0