get all class name in css file

Question

I got css file like this :

let string =

    .papa, .aka {
        color:red
    }
    .mama .ok {
        color:blue
    }

    div .chacha{
        transition: opacity 0.2s;
    } .sasa {
        background:url(home.png)
    }

I want to fetch all the class name in the file and put in array. Expected result :

[.papa, .aka, .mama, .ok, .chacha, .sasa]

My try :

let pattern = /(?:[\.]{1})([a-zA-Z_]+[\w-_]*)(?:[\s\.\{\>#\:]{1})/igm

let match = pattern.exec(string);

console.log(match);

I only got [.papa].

See: https://stackoverflow.com/a/432503/5894241 You need to invoke `regex.exec` multiple times to get subsequent capturing groups. — Nisarg Shah, Aug 14 '18 at 05:37

Rahul Sharma · Answer 1 · 2018-08-21T12:28:24.917

2

You can use the string.match

let string =
`
    .papa, .aka {
        color:red
    }
    .mama .ok {
        color:blue
    }

    div .chacha {
        transition: opacity 0.2s;
    } .sasa {
        background:url(home.png)
    }
`
var arr = string.match(/(?:[\.]{1})([a-zA-Z_]+[\w-_]*)(?:[\s\.\,\{\>#\:]{0})/igm);
console.log(arr);

edited Aug 21 '18 at 12:28

answered Aug 14 '18 at 05:45

Rahul Sharma

8,373
1
11
35

There is case it doesn't, I made an update to string, class .papa is missing now – angry kiwi Aug 21 '18 at 03:39

score 0 · Answer 2 · answered Aug 14 '18 at 06:21

0

let arr = [];
match.input.replace(pattern, function(match, g1, g2) { arr.push(g1); });
console.log(arr);

answered Aug 14 '18 at 06:21

Shiv Kumar Baghel

2,366
5
16
33

4

While this code may answer the question, please explain what you have done to solve the problem. Code-only answers are usually not helpful to other readers, and tend to attract downvotes. See [How do I write a good answer?](https://stackoverflow.com/help/how-to-answer) – Jesse Aug 14 '18 at 07:02

get all class name in css file

2 Answers2