Regular expression for matching css urls

Question

I have regular expression

/url\\(\\s*(?!data:)([^\\)\\s]+)\\s*\\)?/

It searches in css for lines like this

background-image: url(/path.to/img.png);

And ignores the lines

background-image: url(data:image/svg+xml;base64, PHN2ZyB4bWxucz) no-repeat;

It is used to find image paths and replace them.

But if Data url has quotes

background-image: url("data:image/svg+xml;base64, PHN2ZyB4bWxucz") no-repeat;

Regular expression matches it. I need to match usual image url and ignore Data url with single, double quotes or without them.

That's nice. Good luck figuring that out. Did you have a question? — Marc B
– Marc B, Commented Feb 14, 2014 at 9:26
That is actually my question because I am not strong in regular expressions and will spend days to do that. Maybe someone do that faster then me. — oleksii.svarychevskyi
– oleksii.svarychevskyi, Commented Feb 14, 2014 at 9:30
Questions usually have a ? in them... all you've done is treat this place as a "do my job for me" jobs board. — Marc B
– Marc B, Commented Feb 14, 2014 at 9:31
But others also asked such questions and I answered them if I knew. — oleksii.svarychevskyi
– oleksii.svarychevskyi, Commented Feb 14, 2014 at 9:33

Sabuj Hassan · Accepted Answer · 2014-02-14 10:29:24Z

2

url\\(\\s*(?!["']?data:)([^)]+)\\)

In this regex, it will ignore anything like below(accepting optional space after (

url("data...
url(data:...

Which means it will only match the first example that you have given on the question.

edited Feb 14, 2014 at 10:29

answered Feb 14, 2014 at 10:12

Sabuj Hassan

39.7k14 gold badges83 silver badges88 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

oleksii.svarychevskyi Over a year ago

Thanks for the reply but your expression does not match background-image: url("/path/to/img.jpg");.

oleksii.svarychevskyi Over a year ago

Thanks your answer do exactly what I want.

Didier Ghys Over a year ago

Thanks. I have added checking for an eventual space before data or "dataor 'data: url\(\\s*(?!`\\s*["']?data:)([^)]+)\)

Victor Bocharsky · Accepted Answer · 2014-02-14 10:19:08Z

1

Try to use pattern with ("|')?:

/url\\(("|')?\\s*([^(:;,]+)\\s*("|')?\\);?/

("|')? allow you also to match single or double quotes

edited Feb 14, 2014 at 10:19

answered Feb 14, 2014 at 9:34

Victor Bocharsky

12.4k14 gold badges66 silver badges92 bronze badges

3 Comments

oleksii.svarychevskyi Over a year ago

Sorry I tried /url\\((\"|')?\\s*(?!data:)([^\\)\\s]+)\\s*(\"|')?\\)?/ but it still matches data url with both quotes(.

oleksii.svarychevskyi Over a year ago

Now its not matching string with usual url. I think ("|')? should be used somewhere inside (?!data:).

oleksii.svarychevskyi Over a year ago

Using :;, instead of data is cool idea. But as a result it is not selecting sub strings as I expected. The another answer suits me perfect. I like your answer but cannot accept it.

Collectives™ on Stack Overflow

Regular expression for matching css urls

2 Answers 2

3 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related