url2img.user.js

// ==UserScript==
// @name           url2img
// @namespace      http://relucks.org/
// @include        http*
// ==/UserScript==

(function() {
    url2img(document)
    document.addEventListener("DOMNodeInserted", function(e){
        if (e.target.tagName) {
            setTimeout(function() { url2img(e.target) }, 100)
        }
    }, false)


    function url2img(doc) {
        var re = new RegExp('(^https?://.+\.(png|jpg|jpeg|gif)$)', 'i')
        $X('//a[@href]', doc).forEach(function(a) {
            if (re.test(a.href) && !hasImg(a)) {
                replace(a)
            }
        })
    }

    function hasImg(a) {
        var cs = a.childNodes
        for (var i = 0; i < cs.length; i++) {
            if (cs[i].tagName == 'IMG' && cs[i].src == a.href) {
                return true
            }
        }
        return false
    }

    function replace(a) {
        var img = document.createElement('img')
        img.src = a.href
        a.appendChild(img)
        a.style.color = '#fff'
        a.style.backgroundColor = '#0f0'
        img.style.border = '1px solid #0f0'
    }

    // http://gist.github.com/raw/3242/1a7950e033a207efcfc233ae8d9939b676bdbf46
    // simple version of $X
    // $X(exp);
    // $X(exp, context);
    function $X (exp, context) {
        context || (context = document);
        var expr = (context.ownerDocument || context).createExpression(exp, function (prefix) {
            return document.createNSResolver(context)(prefix) ||
                (document.contentType == "application/xhtml+xml") ? "http://www.w3.org/1999/xhtml" : "";
        });

        var result = expr.evaluate(context, XPathResult.ANY_TYPE, null);
        switch (result.resultType) {
            case XPathResult.STRING_TYPE : return result.stringValue;
            case XPathResult.NUMBER_TYPE : return result.numberValue;
            case XPathResult.BOOLEAN_TYPE: return result.booleanValue;
            case XPathResult.UNORDERED_NODE_ITERATOR_TYPE:
                // not ensure the order.
            var ret = [], i = null;
            while (i = result.iterateNext()) ret.push(i);
                return ret;
        }
        return null;
    }
})()