如何重新链接/取消链接图像 URL 以指向完整图像? [英] How to relink/delink image URLs to point to the full image?

问题描述

我正在尝试使用 Greasemonkey 动态更改网页的 URL.

I'm trying to change the URL's of a webpage on the fly using Greasemonkey.

目标页面有如下链接:

<a name="217258323" href="http://foobar.net/photo/217258323/?pgid=&amp;gid=4933418&amp;page=0">
  <img style="border:1px solid #fff;padding:5px;background:#fff;"
    height="120" width="160" alt="Gallery pic 1 of 20 pics" border="0"
    src="http://i.foo.net/images/thumb/52/217/217258323.jpg">
</a>

我想像这样改变它们:

<a name="217258323" href="http://i.foo.net/images/full/52/217/217258323.jpg">
  <img style="border:1px solid #fff;padding:5px;background:#fff;"
    height="120" width="160" alt="Gallery pic 1 of 20 pics" border="0"
    src="http://i.foo.net/images/thumb/52/217/217258323.jpg">
</a>

也就是说，我想用图像 src 值替换链接 href -- 但用 /full/ 而不是 /thumb/.

That is, I want replace the link href with the image src value -- but with /full/ instead of /thumb/.

任何示例脚本或示例来实现我想要做的事情?

Any sample scripts or examples to achieve what I'm trying to do?

推荐答案

这是一个标准的图像重新链接/取消链接问题，您可能会为几乎任何站点找到几个预制的用户脚本.

This is a standard image relink/delink problem, and you can probably find several premade userscripts for just about any site.

但不要尝试仅使用正则表达式来实现这一点，那种方式很疯狂(和损坏的脚本).

But don't try to do this with just regex, that way lies madness (and broken scripts).

以下是使用 DOM 方法重新链接示例的方法:

Here's how to relink your example using DOM methods:

var thumbImgs = document.querySelectorAll ("a > img[src*='/thumb/']");

for (var J = thumbImgs.length-1;  J >= 0;  --J) {
    var img     = thumbImgs[J];
    var lnkTarg = img.src.replace (//thumb//, "/full/");
    var link    = img.parentNode;
    link.href   = lnkTarg;
}

这篇关于如何重新链接/取消链接图像 URL 以指向完整图像?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！