Making sure the src attribute has http:

Question

I am using this jquery script to import parts of wikipedia articles, but I have run into an issue where when this script is putting together an image tag, it strips out "http:" (or rather, it was't there in the first place?) from the src attribute. How can I ensure every img tag has http: at the beginning of the src attribute without adding another one if it is already there?

Here is what I am using:

https://gist.github.com/steren/704540

Specifically this is what adds the image in (but leaves out "http:"):

//get images of right side table
var rightTableImages = content.find('table a.image img');        
//append first image to main container  
wikiContainer.append($(rightTableImages).first().removeAttr('srcset').removeAttr('height').removeAttr('width').addClass("imageForArticle").wrap('<div class="wikipediaLogo"></div>').parent());

I have tried adding a class to the images by adding .addClass("imageForArticle") to the above and then tried this:

$('. imageForArticle').attr('src', function(index, src) {
return 'http:' + src;
});

But when I do that, if there are multiple articles in one page it sometimes adds an extra http: to one when I reload the page.

Why do you need that? URLs like `//example.com/` are [perfectly valid](https://en.wikipedia.org/wiki/Protocol_relative_URL). — svick, Feb 24 '14 at 16:26

score 2 · Accepted Answer · answered Feb 24 '14 at 16:01

2

Try

$('. imageForArticle').attr('src', function (index, src) {
    return (src.indexOf('http') == 0) ? src : 'http:' + src;
});

if src.indexOf('http') == 0 it starts with http than return same else add http:

Or

$('. imageForArticle').not('[src^="http"]').attr('src', function (index, src) {
    return 'http:' + src;
});

Exclude results with src strating from http $('. imageForArticle').not('[src^="http"]')

answered Feb 24 '14 at 16:01

Tushar Gupta - curioustushar

58,085
24
103
107

Does the carat `^` mean "starts with"? Thank you, that worked a treat. – user2219915 Feb 24 '14 at 16:10
@user2219915 yes Read [Attribute Starts With Selector ^](https://api.jquery.com/attribute-starts-with-selector/) – Tushar Gupta - curioustushar Feb 24 '14 at 16:12
What about relative URLs like `../image.jpg`? Your code would change that to `http:../image.jpg`, which isn't right. – svick Feb 24 '14 at 16:29
I am pulling in images from wikipedia, so none are relative urls. I'd cross that bridge if I came to it. – user2219915 Feb 25 '14 at 15:46

score 0 · Answer 2 · answered Feb 24 '14 at 16:02

0

Try this:

$('. imageForArticle').attr('src', function (index, src) {
    return (src.indexOf('http') < 0) ? src : 'http:' + src;
});

answered Feb 24 '14 at 16:02

Furquan Khan

1,586
1
15
30

Making sure the src attribute has http:

2 Answers2