Geek Answers Handbook

Is there a way to get a number from an src url image using javascript?

I searched everywhere and cannot find the answer to my question. Maybe I'm asking the wrong questions ...

So, my problem is: I have a blog roll that displays the latest images of posts, where I have sites and blogs from different platforms that I want to share with my readers, including WordPress. Most of the images (thumbnails) are square, but those of WP magazines have several sizes. By analyzing the src image, I was able to find out that replacing the last part of the URL did the trick, and I could make these images suitable for the rest without screwing up my website design. :)

Example:

http://colecaodisney.files.wordpress.com/2014/08/casty.jpg?w=112 <--- original image src http://colecaodisney.files.wordpress.com/2014/08/casty.jpg? w = 126 & h = 126 & crop = TRUE <--- edited by me to fit my blogroll

Since I do not have access to these src images, and with CSS is not an option due to the fact that my blog role works with javascript, I did this using jquery:

img = $(this).find('img').attr('src').replace('?w=112', '?w=126&h=126&crop=TRUE');

The problem is that where the number 112, that is, the width of the thumbnail, does not always coincide with the number. My solution so far is a chain of notes for each new width number that eventually appears. And I was wondering everywhere, if there is a way to write this line of code so that it works no matter what the number representing the width might be ...

Thanks for any help.

+4
2

.

img = $(this).find('img').attr('src').replace(/w=[0-9]+/, 'w=126&h=126&crop=TRUE');

:

= ()

[0-9]

[0-9] +

+3

attr() , ( ) , :

$(this).find('img').prop('src', function(i, src) {
    return src.replace(/(w=\d+)$/, '?w=126&h=126&crop=TRUE');
});

JS Fiddle demo ( Brian).

( ), get(), :

var changedImages = $(this).find('img').prop('src', function(i, src) {
    return src.replace(/(w=\d+)$/, '?w=126&h=126&crop=TRUE');
}).get();

:

+6

More articles:


All Articles