Selecting image url from html using javascript regexp

Question

I'd like to select the image source url from html code using javascript regexp. I'm using it to simplify using picasaweb images in other websites. I'm rather new at this, and I constructed a regex using http://www.regular-expressions.info/javascriptexample.html, and there it works like a charm, but not in my own script. Can somebody point me out the error in my script?

function addImage() {
var picasaDump=prompt("Copy the picasa link");
if (picasaDump!=null && picasaDump!="")
{
    var regMatch = new RegExp("http:\/\/\S\.[jJ][pP][eE]?[gG]");
    var imageLink = regMatch.exec(picasaDump);
    if(imageLink == null) {
        alert("Error, no images found");
    } else if(imageLink.length > 1) {
        alert("Error, multiple images fount");
    } else {
        further parsing...
    }
}
}

EDIT: Some sample input

<a href="http://picasaweb.google.com/lh/photo/NHH78Y0WLPAAzIu0lzKlUA?feat=embedwebsite"><img src="http://lh3.ggpht.com/_ADW_3zOQhj8/TGgN4bXtfMI/AAAAAAAABCA/w6M-JKzNtBk/s144/DSC_2132.jpg" /></a>

Community · Accepted Answer · 2017-05-23 10:30:24Z

1

Here is another SO thread that talks about the appropriate regular expression for this: Regex to check if valid URL that ends in .jpg, .png, or .gif

Regardless of the regular expression you use, a simple one-liner to test a string is :

({Regular_Expression}>/gi).test({String_To_Test}) 

For e.g. 
(/http:\/\/.+?\.jpg|jpeg/gi).test("http://www.google.com/image.jpg")

edited May 23, 2017 at 10:30

CommunityBot

11 silver badge

answered Aug 17, 2010 at 13:08

letronje

9,15811 gold badges47 silver badges53 bronze badges

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

1 Comment

TuxM Over a year ago

I'm not trying to validate an image url, I'm only extracting it

lincolnk · Accepted Answer · 2010-08-17 13:48:25Z

0

in this line

var regMatch = new RegExp("http:\/\/\S\.[jJ][pP][eE]?[gG]");

you're escaping characters in the string rather than in your regular expression. also \S will only match a single character. it should be

var regMatch = new RegExp("http:\\/\\/\\S+\\.[jJ][pP][eE]?[gG]");

answered Aug 17, 2010 at 13:48

lincolnk

11.2k4 gold badges43 silver badges63 bronze badges

1 Comment

TuxM Over a year ago

Thanks a million, that's the solution I was looking for!

Robusto · Accepted Answer · 2010-08-17 12:40:26Z

0

You can try

var regMatch = new RegExp("http:\/\/.+?\.jpg|jpeg","gi");

answered Aug 17, 2010 at 12:40

Robusto

32k8 gold badges59 silver badges79 bronze badges

1 Comment

TuxM Over a year ago

That will also match a regular link, I've added sample input to demonstrate

Ryan Kinal · Accepted Answer · 2010-08-17 13:35:02Z

This would be best implemented with look-behind. However, since JavaScript doesn't support look-behind, we have to mimic it by reversing the string, and using a look-ahead.

String.prototype.reverse = function () {
    return this.split('').reverse().join('');
};

var input = '<a href="http://picasaweb.google.com/lh/photo/NHH78Y0WLPAAzIu0lzKlUA?feat=embedwebsite"><img src="http://lh3.ggpht.com/_ADW_3zOQhj8/TGgN4bXtfMI/AAAAAAAABCA/w6M-JKzNtBk/s144/DSC_2132.jpg" /></a>'
var matches = input.reverse().match(/(gepj|gpj|gif|png)\..+?\/\/:ptth(?=\"\=crs)/g);

This will return an array of reversed image URLs, so you'll have to re-reverse them.

for (i = 0; i < matches.length; i++)
{
    matches[i] = matches[i].reverse();
}

If you know the format of your image links, you may be able to specify more of a look-ahead, like so:

var matches = input.reverse().match(/(gepj|gpj|gif|png)\..+?\/\/:ptth(?=\"\=crs gmi)/g);

Which will match only if <img is immediately followed by src.

Look-behind mimicking taken from Steven Levithan

Collectives™ on Stack Overflow

Selecting image url from html using javascript regexp

4 Answers 4

1 Comment

1 Comment

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related