Question

我到处搜寻，无法找到问题的答案。也许我在问错误的问题......

所以，我的问题是：我有一个blogroll显示最新的帖子图片，我有来自不同平台的网站和博客，我想与读者分享，包括WordPress。大多数图像（缩略图）都是方形的，但WP博客中的图像有多种尺寸。分析图像src，我能够发现替换url的最后部分做了诀窍，我可以使这些图像与其余部分相符，而不会搞砸我的网站的设计。：）

示例：

http://colecaodisney.files.wordpress.com/2014/08/casty.jpg?w=112＆lt; ---原始图像src http://colecaodisney.files.wordpress.com/2014/08/casty.jpg?w=126&h=126&crop=TRUE＆lt; ---由我编辑以适合我的blogroll

由于我无法访问那些图像src，并且因为我的blogroll与javascript一起使用而不能使用CSS，所以我使用jquery进行了这些更改：

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

问题在于数字112的位置，即缩略图的宽度，并不总是相同的数字。到目前为止，我的解决方案是链接一些取代每个最终显示的新宽度数。而且我想知道，并且无处不在，如果有一种方法可以编写那行代码，那么无论表示宽度的数字是多少都可以...

感谢您的帮助。

Answer 1

因为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();

参考文献：

Answer 2

您需要使用正则表达式。

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

这将匹配：

W =（位）

[0-9]匹配数字

[0-9] +匹配连续数字

有没有办法从图像src url用javascript获取一个数字？

2 个答案: