Question

我疯了，我在js或html上不太好，所以PLZ试着帮助我。在我想写的博客博客上 1）使用goo.gl服务自动创建短链接 2）通过按钮在twitter上分享这个短链接 js代码我用来缩短链接

<script type="text/javascript">
    var shorturl;
      var longUrl="http://*****" + "<data:blog.url/>";
      var request = gapi.client.urlshortener.url.insert({
      'resource': {
      'longUrl': longUrl
         }
       });
       request.execute(function(response) 
       {

        if(response.id != null)
        {
            shorturl=response.id;
        }
        else
        {
            shorturl="<data:blog.url/>";
            alert("error: creating short url n"+ response.error);
        }
        document.getElementById('shorturlid').setAttribute("data-url",shorturl);
    });
    </script>

twitter按钮的代码

<a href="https://twitter.com/share" class="twitter-share-button" id="shorturlid" data-via="*****" data-size="large" data-count="none" data-hashtags="*****">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

这只是共享当前页面的URL，所以看起来我的代码什么也没做。

任何解决方案？

Answer 1

我创建了一个jsfiddle，我注意到，一旦执行了twitter脚本，就无法访问shorturlid的链接。

因为它会改变DOM很多。做你想做的事情的更好方法是在准备好缩短的url并添加到DOM之后调用twitter脚本。

我的脚本似乎有效，但有时我收到以下错误Error. User Rate Limit Exceeded.不确定它是什么。也许你经常运行脚本。

（我使用过jQuery因为它更容易创建DOM元素。当然这同样适用于纯JS。）

var longurl = 'http://www.google.com/';
var $tw_link;

gapi.client.load('urlshortener', 'v1', function () {
    var request = gapi.client.urlshortener.url.insert({
        'resource': {
            'longUrl': longurl
        }
    });
    var resp = request.execute(function (resp) {
        if (resp.error) {
            $("#show").html('Error. ' + resp.error.message);
        } else {
            $("#show").html("Short URL for " + longurl + " is: " + resp.id);
            var shorturl = resp.id; //document.getElementById('shorturlid').setAttribute("data-url", shorturl); // not working because twitter button changes DOM!!
            $tw_link = $('<a/>');
            $tw_link.attr('href', 'http://twitter.com/share');
            $tw_link.addClass('twitter-share-button');
            $tw_link.attr('data-url', shorturl);
            //var body = document.getElementsByTagName('body');
            $('#show').append($tw_link);
            console.log(shorturl, $tw_link);
            loadTwitter();
            //alert(shorturl);
        }
    });
});

function loadTwitter() {
    ! function (d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0],
            p = /^http:/.test(d.location) ? 'http' : 'https';
        if (!d.getElementById(id)) {
            js = d.createElement(s);
            js.id = id;
            js.src = p + '://platform.twitter.com/widgets.js';
            fjs.parentNode.insertBefore(js, fjs);
        }
    }(document, 'script', 'twitter-wjs');
};

来自javascript值的Html标记属性值

1 个答案: