javascript - 如何让这个链接在 JavaScript 中工作

Question

好的，基本上我有这个 javascript 文件 http://assets.revback.com/scripts/share1.js基本上通过 JavaScript 添加了一堆共享按钮。

我想要做的是更改 Twitter 图像链接以使用 url 缩短器:

所以代替:

<a href=\"http:\/\/twitter.com\/home?status=Interesting Post:(UURRLL)\" title=\"Click to share this page on Twitter\"><img src=\"http:\/\/assets.revback.com\/scripts\/images\/twitter.png\" border=\"0\"\/><\/a>

我想使用

<a href="#" onClick="window.location='http://ko.ly?action=shorten&uri=' + window.location + '&dest=twitter.com/?status=Reading ';"><img src=http://assets.revback.com/scripts/images/twitter.png"><\/a>

但我需要底部的一个，用 javascript 友好的语法编写。即，就像在顶部一样，您有 http://，而不是 http://

Answer 1

失去onclick 。它没有任何好处，因为它的作用就像一个普通的链接(除了更损坏的链接)。现在您不必担心在 JavaScript 中转义 JavaScript 以及随之而来的 \\\\\\\\疯狂。

var buttonhtml= (
    '<a href="http://ko.ly?action=shorten&amp;uri='+encodeURIComponent(location.href)+'&amp;dest=twitter.com/?status=Reading">'+
        '<img src=http://assets.revback.com/scripts/images/twitter.png">'+
    '</a>'
);

(请注意， encodeURIComponent 对于将当前 URL 正确插入到另一个 URL 中而不破坏至关重要，它也可以保护您免受 HTML 注入(inject)，因为 < 和 & 字符得到 % 编码。如果没有这种保护措施，任何包含您的脚本的页面都存在跨站点脚本漏洞。)

更好的是，完全放弃 HTML 字符串传递并使用 DOM 方法来创建内容。那你就不用担心 &和其他 HTML 转义，并且您不必使用粗略的、不可靠的字符串替换来破解您的 HTML。您似乎正在使用 jQuery，因此:

var link= $('<a>', {href:'http://ko.ly?action=shorten&uri='+encodeURIComponent(location.href)+'&dest=twitter.com/?status=Reading'});
link.append('<img>', {src: 'http://assets.revback.com/scripts/images/twitter.png'});
link.appendTo(mydiv);

预计到达时间:我会用循环替换整个标记困惑，并将数据分解为查找。 IE。像这样:

(function() {
    var u= encodeURIComponent(location.href);
    var t= encodeURIComponent(document.title);
    var services= {
        Facebook: 'http://www.facebook.com/sharer.php?u='+u,
        Twitter: 'http://ko.ly?action=shorten&uri='+u+'&dest=twitter.com/?status=Reading',
        StumbleUpon: 'http://www.stumbleupon.com\/submit?url='+u+'&title='+t,
        // several more
    };

    var share= $('<div class="ea_share"><h4>Share this with others!</h4></div>');
    for (var s in services) {
        share.append($('<a>').attr('href', services[s]).attr('title', 'Click to share this on '+s).append(
            $('<img>').attr('src', 'http://assets.styleguidence.com/scripts/images/'+s.toLowerCase()+'.png')
        ));
    }
    $('#question .vt').append(share);
})();