19

Regex to match a CSS class name

 2 years ago
source link: https://www.codesd.com/item/regex-to-match-a-css-class-name.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

Regex to match a CSS class name

advertisements

I am trying to write a regex that matches a valid CSS class name structure. I have this so far:

$pattern = "([A-Za-z]*\.[A-Za-z]+\s*{)";

$regex = preg_match_all($pattern, $html, $matches);

However, a class name can be in the following formats that my regex won't match:

p.my_class{
}
p.thisclas45{
}

These are just some cases, I've looked around to find the rules of how you can name a class in a style block but couldn't find anything. Anyone know where the rules for the class naming conventions are?

Are there any more cases that I need to consider? What regex would you use to match a class name?

I have already narrowed it down to a style block using the PHP DOM Document class.


Have a look at http://www.w3.org/TR/CSS21/grammar.html#scanner

According to this grammar and the post Which characters are valid in CSS class names/selectors? this should be the right pattern to scan for css classes:

\.-?[_a-zA-Z]+[_a-zA-Z0-9-]*\s*\{

Note: Tag names are not required as prefix for classes in css. Just .hello { border: 1; } is also valid.

Related Articles

Regex is the css class name of a single string containing multiple classes

I have a long string that contains multiple css classes. With regex I would like to match every class name as I then need to replace these class names like so: <span>CLASSNAME</span> I have tried for hours to come up with a solution and I thin

Type each css class name declared in braces using regex

Hi Im trying to write a simple CSS parsing script in PHP that enables me to put previously declared classes within a css rule, i.e. the Mixins functionality of less and Sassy. This regex only grabs the last css class name within the curly braces: {.+

A tape string for a secure CSS class name?

I have an arbitrary string that comes from a database. I want to place this string as an HTML class name on a web page. I am not sure what characters to expect. How can I remove the spaces and special characters to make it "safe" to be a CSS cla

Does the length of the CSS class name affect browser performance?

Example: Gmail. From all the DOM elements, ~2000 have at least one CSS class and there are a total of ~500 distinct CSS class names on the page. Gmail uses closure-stylesheets to minify/uglify their CSS class names. Does this step increase performanc

Is there a way to make HTML code independent of changes in CSS class names?

I am using Twitter Bootstrap 3 for a while, but now Twitter Bootstrap 4 is coming. And new Twitter Booststrap comes with some changes, like renaming .table-condensed to .table-sm for example. For sake of future possible migration from current to futu

Regex to match everything except the name and extension of the image

I have this regex ((?:https?\:\/\/)(?:[a-zA-Z]{1}(?:[\w\-]+\.)+(?:[\w]{2,5}))(?:\:[\d]{1,5})?\/(?:[^\s\/]+\/)*(?:[^\s]+\.(?:png|jpe?g|gif|svg|PNG|JPE?G|GIF|SVG))(?:\?\w+=\w+(?:&\w+=\w+)*)?) to select these image urls from a string http://my.a.example

Why does Visual Studio not resolve my CSS class names?

Whenever I am working in Visual Studio I always found that it will not resolve the css class names in my html. The CSS Class names will appear with the green squiggly line in Visual Studio but then the page will render fine when viewing it in the bro

Process blank spaces in CSS class names with Jsoup

I want to select some supermarket product info from this page: http://www.angeloni.com.br/super/index?grupo=15022 For that I should select <ul> tags with class "lstProd ": If the class name were "lstProd" it would be easy, but th

Extend PHP Markdown to accept CSS class names

I'm a huge fan of Markdown (using it in nearly all of my PHP projects) but not a fan of its limited output. Much of the rendering is a bit too simple, and doesn't really allow me much control or freedom regardings its layout. For instance, I can inse

How to get a CSS class name using Selenium?

I am new in selenium testing. I want to get the css class name using selenium. I am using eclipse and Java for development. <table > <tr class="odd"><td>Odd row</td></tr> <tr class="even"><td>E

Getting div content by css class name

Using dom I want to get content from some specific div. My Current situation is this : I want to get content from site link whose html structure is as below. I want that css class data for my local database. I think this is possible only using dom. H

Regular expression for CSS class names

I'm trying to create a function in PHP which would go through CSS and JS files, and replacing class names and IDs (but not direct HTML elements or the CSS properties within) in CSS selectors without disrupting the other content. However, of all the d

Effect of applying the non-existent CSS class name

Does it have an adverse effect on a browser's performance to assign class name to an element's css class attribute if the class never actually defined? It is not unusual to use class names for selectors with JQuery. I normally use a class that is onl

Dynamic CSS class names in GWT

I am in the process of porting a simple CSS grid system to GWT. My CSS file currently has classes like .size1, .size2 etc., and I have a CSS resource that looks like - interface MyResource extends CSSResource { @ClassName("size1") String size1()

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK