Question

我在页面加载时为我的推文按钮生成内容，但即使我的脚本首先运行widget.js仍然运行之前，我尝试使用twttr.widget.load（）更新值，但它没有＆＃ 39;工作。

是否可以在最初加载后更新twitter按钮的值？或者在内容加载后进行初始化？

以下是我使用的代码。

我也尝试在我的脚本之前和之后将widget.js放在HTML上。

text = quote[0].content.substring(3, quote[0].content.length - 5);
document.querySelector("#quote").innerHTML = text; 
document.querySelector(".twitter-share-button").setAttribute("data-text", text);
twttr.widgets.load(document.getElementById("tweet"));

HTML

    <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<script>window.twttr = (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0],
    t = window.twttr || {};
    if (d.getElementById(id)) return t;
    js = d.createElement(s);
    js.id = id;
    js.src = "https://platform.twitter.com/widgets.js";
    fjs.parentNode.insertBefore(js, fjs);

    t._e = [];
    t.ready = function(f) {
        t._e.push(f);
        };

        return t;
    }(document, "script", "twitter-wjs"));</script>
<script src="script.js"></script>

Answer 1

twitter小部件异步加载。

Twitter documentation

异步加载widgets.js文件需要您在绑定事件之前等待

无论您的代码是在加载小部件行之前还是之后，

postExecute

你必须等待小部件被加载。

试试此代码

twttr.widgets.load(document.getElementById("tweet"));

Answer 2

我找到了一种方法，这是你需要知道的：

1）初始HTML中不需要有Twitter按钮（这只会创建一个您需要稍后删除的重复按钮）。

2）只需创建按钮

即可

var button = document.createElement('a');
button.classList += "twitter-share-button";
button.innerHTML = "Tweet";
button.setAttribute("data-text", text);
button.setAttribute("data-via", via);
button.setAttribute("href", "https://twitter.com/intent/tweet");

并将其附加到您想要的任何地方

document.querySelector(".quote").appendChild(button);

之后，您需要做的就是重新加载小部件

twttr.widgets.load();

由于它异步加载我不知道在调用加载方法之前是否需要检查，我已经重新加载了几分钟而且还没有发现任何问题。它的问题，如果您的按钮没有正确加载，请记住这一点。

在twitter小部件

2 个答案: