Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Regular Expression to convert relative CSS image backgrounds to absolute

Posted on 2009-12-16
11
Medium Priority
?
755 Views
Last Modified: 2013-11-18
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.
0
Comment
Question by:yetti78
11 Comments
 
LVL 75

Expert Comment

by:käµfm³d 👽
ID: 26069481
What about:
url\(([^/][^\)]+\))

replace with:

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

Open in new window

0
 
LVL 75

Expert Comment

by:käµfm³d 👽
ID: 26069482
Corrected:
url\(([^/][^\)]+)\)

Open in new window

0
 
LVL 40

Expert Comment

by:Gurvinder Pal Singh
ID: 26069491
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

0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:yetti78
ID: 26072139
kaufmed,

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

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

-y
0
 
LVL 75

Expert Comment

by:käµfm³d 👽
ID: 26073027
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)
0
 

Author Comment

by:yetti78
ID: 26073538
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

0
 

Author Comment

by:yetti78
ID: 26073582
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
0
 
LVL 35

Expert Comment

by:Terry Woods
ID: 26074966
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

0
 
LVL 75

Accepted Solution

by:
käµfm³d   👽 earned 2000 total points
ID: 26075543
I'm not sure what you were attempting to do with the "http" object and its logic, but the following worked for me using the following test cases:

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

produced

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

in both instances.
public static String fixRelatives(String HTML){
    Pattern pattern = Pattern.compile("url\\('?([^/][^\\)]+?)'?\\)",Pattern.CASE_INSENSITIVE);
    Matcher match = pattern.matcher((CharSequence)HTML);
    
    HTML = match.replaceAll("url('/$1')");
    
    return HTML;
}

Open in new window

0
 
LVL 75

Expert Comment

by:käµfm³d 👽
ID: 26075558
P.S.

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

Author Closing Comment

by:yetti78
ID: 31667196
Boom goes the dynamite
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

As most anyone who uses or has come across them can attest to, regular expressions (regex) are a complicated bit of magic. Packed so succinctly within their cryptic syntax lies a great deal of power. It's not the "take over the world" kind of power,…
There is an easy way, in .NET, to centralize the treatment of all unexpected errors. First of all, instead of launching the application directly in a Form, you need first to write a Sub called Main, in a module. Then, set the Startup Object to th…
The goal of the tutorial is to teach the user how to use functions in C++. The video will cover how to define functions, how to call functions and how to create functions prototypes. Microsoft Visual C++ 2010 Express will be used as a text editor an…
The goal of the video will be to teach the user the concept of local variables and scope. An example of a locally defined variable will be given as well as an explanation of what scope is in C++. The local variable and concept of scope will be relat…
Suggested Courses

571 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question