2

我是 Greasemonkey 的新手,我想用一个<img>标签替换图像的链接。

例如,这个论坛页面有一堆链接,如:

<a target="_blank" href="http://url.com/pic.gif">http://url.com/pic.gif</a>

我想用以下图像替换这些链接:

<img src="http://url.com/pic.gif">


我在网上搜索并设法找到了类似Greasemonkey user's group 的内容
但是,我编辑的代码:

var i, x = document.evaluate (
    '//*[@target="_blank"][@href="="]',
    document,
    null,
    XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
    null
);
for (i = 0; i < x.snapshotLength; i++)
    x.snapshotItem(i).setAttribute("href", "img src");

似乎不起作用。

请告知我应该如何创建这个脚本。

4

1 回答 1

4

替换图片链接并不难。但是,我建议您保留链接,但在其中显示图片。这样,如果出现问题,您可以单击。例如,您提供的示例页面的大部分链接图像都在死站上。

其他链接图像仅看起来像是指向图像或可能因“热链接”而被阻止。

为了使代码健壮和简单,我们使用jQuerywaitForKeyElements

这是一个完整的工作脚本,用于断开该示例站点上的有效负载图像链接:

// ==UserScript==
// @name    _Image delinker
// @include http://forums.hardwarezone.com.sg/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @require https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant   GM_addStyle
// ==/UserScript==

var imageExtensions = ["gif", "png", "jpg", "jpeg"];
var imgExtRegex     = new RegExp(
    '\\.(' + imageExtensions.join ('|') + ')$', 'i'
);

/*-- Tune the CSS path, for each site, to only find links that can be
    the image links you care about.
*/
//-- For forums.hardwarezone.com.sg
waitForKeyElements ("td.page div > a", delinkImage);

function delinkImage (jNode) {
    var imgUrl  = jNode.attr ("href");

    if (imgExtRegex.test (imgUrl) ) {
        //-- Found an image link.  Replace contents.
        jNode.html (
            '<img src="' + imgUrl
            + '" class="gmDeLinked" alt="GM replaced image">'
        );
    }
}

GM_addStyle ( "                                 \
    img.gmDeLinked {                            \
        border:             1px solid lime;     \
        max-width:          90vw;               \
    }                                           \
" );
于 2013-05-23T15:05:42.737 回答