接近完美的标识外链的方法

中午在研究 JavaScript and CSS Type 的时候，无意中发现这个文章，解决困惑我很久的标识外链的问题：
CSS – What is a better solution to mix text with images?
在此之前，我是直接在文章中插入图片的，最原始的方法，虽然视觉上没有什么不妥，但是太Low了：

<img src="/wp-content/uploads/2013/03/ext-link.png" width="10" height="10" />

现在的方法：

<span class="ext-link"></span>

CSS 实现：

.ext-link {
    text-indent: -9999px;
    background: url('./ext-link.png') no-repeat center bottom;
    width: 10px;
    height: 10px;
    display: inline-block;
    padding: 0 10px 0 10px;
}

思考：还有一个思路是不用手工标识，而用JS判断，如果非本站链接，自动添加CSS样式，以后再研究。
参考：bulletproof URL matching regex for javascript?

    var html = 'http://www.google.com';
    html += '\rwww.google.com ';
    html += '\rcode.google.com';
    html += '\rhttp://code.google.com/hosting/search?q=label%3aPython';
    var regex = /(https?:\/\/)?(\w+\.?)+(\/[a-zA-Z0-9\?%=_\-\+\/]+)?/gi;
    alert('before replace:');
    alert(html);
    html = html.replace(regex, function (match, capture) {
        if (capture) {
            return match
        }
        else {
            return 'http://' + match;
        }
    });
    alert('after replace:');
    alert(html);