Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Getting the names of all classes / ids contained within a css file?

Tags:

javascript

css

Is there a way, or a tool, which can be used to get a list of the names of all the classes / ids contained within a css file?

I need to build an xml mapping of all css classes / ids, and doing it manually is very tedious for css files that contain thousands of styles.

like image 834
Ali Avatar asked May 03 '14 12:05

Ali


People also ask

Can we use ID and class together in CSS?

You Can Use Both ID and CSS Class Selectors There are no rules in HTML that prevent you from assigning an element both an ID and a class. This <div> tag will be subject to the styles for the class backgroundOrange .

Can class and ID combine?

ID and Class Selector As we covered above, you can target elements with a combination of ID and class .

How do you select an element with the class name example?

To select elements with a specific class, write a period (.) character, followed by the name of the class. You can also specify that only specific HTML elements should be affected by a class. To do this, start with the element name, then write the period (.)


1 Answers

  1. Include your css file into any html file.
  2. In console execute the following code:

    Array.prototype.forEach.call(document.styleSheets[0].cssRules,function(a){console.log(a.selectorText)})

  3. In the console will be the listing of all css tags used in your stylesheet.

like image 104
Vlas Bashynskyi Avatar answered Sep 18 '22 22:09

Vlas Bashynskyi