CSS selector regex match start and end

Question

let say I have elements with title attribute like following

<div title="custom-marker-awlr-tailrace bbu-l2"></div>
<div title="custom-marker-aws-tailrace btut"></div>
<div title="custom-marker-arr-tailrace sbu-l3"></div>
<div title="custom-marker-wqs-tailrace bbu-l2"></div>
<div title="custom-marker-wqs-tailrace bbu-l1"></div>

how do I select div with title custom-marker-wqs-tailrace bbu-l2 using CSS regex selector?

something like div[title*="customer-marker-wqs...???"] I don't know what should I write in place of ???

There is no such thing as a "CSS regex selector." The attribute selector allows "starts with" / "ends with" and similar selections. — CBroe, Jul 05 '22 at 07:33

score 2 · Accepted Answer · answered Jul 05 '22 at 07:30

2

You may use a single attribute selector, e.g.

div[title="custom-marker-wqs-tailrace bbu-l2"] {
  ...
}

so you match the exact string or you could chain two attribute selectors, e.g.

div[title^="custom-marker-wqs-tailrace"][title$="bbu-l2"] {
   ...
}

by selecting a title starting (^=) with custom-marker-wqs-tailrace and ending ($=) with bbu-l2

answered Jul 05 '22 at 07:30

Fabrizio Calderan

120,726
26
164
177

thank you very much, this selector `div[title^="custom-marker-wqs-tailrace"][title$="bbu-l2"]` saved my day. – Dariel Pratama Jul 05 '22 at 07:34

score 0 · Answer 2 · answered Jul 05 '22 at 07:29

0

Do you know this? https://developer.mozilla.org/en/docs/Web/CSS/CSS_Selectors But you're very close:

startsWith: div[title^="customer-marker-wqs"]
endsWith:   div[title$="customer-marker-wqs"]
contains:   div[title*="customer-marker-wqs"]

answered Jul 05 '22 at 07:29

Sven

524
4
10

CSS selector regex match start and end

2 Answers2