Question

我正在尝试使用fb文档中提供的标准按钮代码向页面添加类似的按钮：

https://developers.facebook.com/docs/plugins/like-button/

由于我想添加的按钮数量，这导致加载速度极慢。

为了解决这个问题，我希望使用jquery根据需要加载按钮，但是如果我以这种方式添加按钮代码，它们会被附加到正确的位置（在开发人员工具元素窗口中可见）但是按钮可以没有出现。

是否有动态添加这些按钮？我猜它不起作用，因为启动后无法添加按钮，但我不知道如何解决这个问题。

我在body标签

中包含了所需的代码

<div id="fb-root"></div>
<script type="text/javascript">
    (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];

        if (d.getElementById(id)){
            return;
        }

        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1&appId=************";
        fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
 </script>

我使用的类似fb的代码是由文档生成的代码：

<div class="fb-like" data-href="https://developers.facebook.com/docs/plugins/" data-layout="button_count" data-action="recommend" data-show-faces="false" data-share="true"></div>

我尝试过这样添加一个按钮：

   $(".myitem").append('<div class="fb-like" data-href="https://developers.facebook.com/docs/plugins/" data-layout="button_count" data-action="recommend" data-show-faces="false" data-share="true"></div>');

更新：

我试过触发FB.XFBML.parse（）;在附加新按钮之后，这会刷新页面上的所有按钮，而不仅仅是新添加的按钮。

Answer 1

要强制刷新/呈现Like按钮，您可以使用FB.XFBML.parse();遍历整个DOM文档。

如果您只想浏览文档的一部分，可以传递DOM对象（例如，带有1个按钮的容器元素）。

FB.XFBML.parse(document.getElementById('containerX'));

加载后动态添加facebook按钮

1 个答案: