CSS with Regex for Id

Css with regex for id

You can use special CSS selector for that: id$='0' means id ends with 0 and id^='s' means id begins with s.

#sections div[id$='0'][id^='s'] {

    color: red;  

}

<div id="sections">

<div id="s10">one</div>

<div id="s2">two</div>

<div id="s30">three</div>

<div id="t1">four</div>

</div>

Regex to match ids in a css file?

#-?[_a-zA-Z]+[_a-zA-Z0-9-]*(?=[^}]*\{)

It explicitly matches valid characters in CSS selector. Which characters are valid in CSS class names/selectors?

http://regexr.com?36e6v

Don't forget to remove comments and quotation like content: '{}' before applying this regex.
Matching comments and quotations is possible with regex. Remove it using unrolling skill, separately.
(I think unrolling is complicated and inefficient enough to rule the integration out.)

It does match color if {} blocks are nested as are in Sass, less

Using regular expression in css?

You can manage selecting those elements without any form of regex as the previous answers show, but to answer the question directly, yes you can use a form of regex in selectors:

#sections div[id^='s'] {
  color: red;
}

<div id="sections">
  <div id="s1">one</div>
  <div id="s2">two</div>
  <div id="s3">three</div>
  <div id="t1">four</div>
</div>

Regular Expression to grab id from selectors?

An ID must begin with a letter and may be followed by any number of letters, digits, hyphens ("-"), underscores ("_"), colons (":"), and periods (".")

Because you do not want things like ::after and :hover, this will work as well

#[a-zA-Z0-9|\-|_|\.]+

How to select css id's with numbers in them?

What about using the following selector:

input[id^='something_stuff_'][id$='_work']

It will get inputs with id starting with "something_stuff_" and finishing with "_work".

How do I use regular expressions in between the CSS Selenium Selector code?

CSS doesn't support regular expressions in general, but if you just want to wildcard the entire middle part out of your ID, that's actually quite doable in CSS, as shown in this answer.

Given your code, you can use:

selenium.click("css=span[id^='mainId'][id$='radiospan1e']");

Regular expression to match ID's and classes in CSS page

You may want to try this:

<?php

$css = <<< EOF
id="<extract this>"
class="<extract this>"id="<extract this2>"
class="<extract this3>"id="<extract this4>"
class="<extract this5>"id="<extract this6>"
class="<extract this7>"id="<extract this8>"
class="<extract this9>"
EOF;

preg_match_all('/(?:id|class)="(.*?)"/sim', $css , $classes, PREG_PATTERN_ORDER);
for ($i = 0; $i < count($classes[1]); $i++) {
    echo $classes[1][$i]."\n";
}
    /*
    <extract this>
    <extract this>
    <extract this2>
    <extract this3>
    <extract this4>
    <extract this5>
    <extract this6>
    <extract this7>
    <extract this8>
    <extract this9>
    */
?>

DEMO:
http://ideone.com/Nr9FPt

Cypress use regex to retrieve elements with matching text in id

Cypress suggests using data- attributes to select elements. If you add data-cy="builder-feature" to all your features, for example, you won't have to care about regular expressions which will just slow your tests down.

cy.get('[data-cy="builder-feature"]').first().click()

See Best Practices.

regex for css class and id

This regex should be able to find classes and ids in your stylesheet.

[.#]([\w.-]+)

Demo: https://regex101.com/r/xB0dZ6/1

It pretty much says the string must start with a # or . then contain at least one alphanumerical character, ., -, or _.

You may want to add a starting anchor or trailing check, .*?{. As is with

marque {
     width: 2.2px
}

The .2px would match this rule.

---

Related Topics