asked on

Regular Expression to convert relative CSS image backgrounds to absolute

Hello, need a reg expression to take relative links in inline HTML CSS style declarations, such as:

<div style="background:url(images/foo.jpg);">.....

and convert them to:

<div style="background:url(/images/foo.jpg);">.....

Notice the slash at the front of the image location. I know this is close, but no cigar:
"url[\\s]*\\([\\s]*['\"][\\s]*[^/^\\\\]"

I need this RegExp to replace *ANY* relative linking preceded by 'url(' to convert to absolute.

kaufmed

What about:

url\(([^/][^\)]+\))

replace with:

url(/\1)
-or-      >based on which parser you're using
url(/$1)

Open in new window

kaufmed

Corrected:

url\(([^/][^\)]+)\)

Open in new window

Gurvinder Pal Singh

Try the attached code

var str = "<div style="background:url(images/foo.jpg);">";
var re = new RegExp("<div(\s*)style="background:url(\s*)\((\s*)[a-zA-Z\./]*\);">", "g");
var myArray = str.replace(re,"<div(\s*)style="background:url(\s*)\((\s*)\[a-zA-Z\./]*\);">" );

Open in new window

yetti78

ASKER

kaufmed,

Eclipse is throwing an error that there isn't a correct escape sequence in your :

url$([^/][^$]+)\)

-y

kaufmed

I see you are using double-backslashes in your code, so maybe:

url\$([^/][^\$]+)\\)

replace with:

url(/\\1)
-or- >based on which parser you're using
url(/$1)

yetti78

ASKER

Nope, didn't run. Here's the java code:

public static String fixRelatives(String HTML){
	Pattern pattern = Pattern.compile("url\\(([^/][^\\)]+)\\)",Pattern.CASE_INSENSITIVE);
	Pattern http = Pattern.compile("[\\s]*http.*",Pattern.CASE_INSENSITIVE);
	Matcher match = pattern.matcher((CharSequence)HTML);
	while(match.find()){
		int end = match.end();
		if(!http.matcher(HTML.substring(end-1)).matches()){
			HTML = HTML.substring(0,end-1) + "/" + HTML.substring(end-1);
		}
		match = pattern.matcher((CharSequence)HTML);
		match.region(end,HTML.length());
	}
}

Open in new window

yetti78

ASKER

Take a look at the code I just copied. Can you format the RegEx to run on anything that has 'url(' in it, to add a '/' = 'url(/' if there isn't one already? Thus : background:url(images/foo.jpg); -> background:url(/images/foo.jpg);

Also would need this for a
background:url('images/foo.jpg'); -> background:url('/images/foo.jpg');

Notice the single quotes above, but is still a relative link.

Thanks in advance

Terry Woods

Try this

import java.util.regex.Pattern;
import java.util.regex.Matcher;
class Module1{
  public static void main(String[] asd){
  String sourcestring = "source string to match with pattern";
  Pattern re = Pattern.compile("(url\\s*\\(\\s*)['\"]?\\s*([^'\"/\\s)])");
  Matcher m = re.matcher(sourcestring);
  String result = m.ReplaceAll("$1/$2");
  }
}

Open in new window

ASKER CERTIFIED SOLUTION

kaufmed

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

kaufmed

P.S.

This also catches instances where an entry is missing a quote (e.g. <div style="background:url('images/foo.jpg);">)

yetti78

ASKER

Boom goes the dynamite