Question

我有一个网站，使用谷歌地图加我自己的JavaScript。我正在使用addThis javascript社交按钮。该网站真的无法使用，直到我的javascript加上google javascript加载并运行（在$(document).ready...上），所以我希望尽量减少延迟。所以我正在考虑推迟AddThis模块，直到其他所有内容都完成，因为它并不重要。

关于stackoverflow的其他问题建议将链接放到我想在页面底部延迟的javascript。但我是否正确地认为这与我无关，因为$(document).ready...不会触发，直到所有链接的javascript都已加载，无论它放在哪里？

如果是这样，我应该在$(document).ready...之后以某种方式加载addThis javascript吗？

虽然我真的不想运行addThis，直到所有谷歌地图图像都被加载（我相信.ready（）不等待这个）。是否有一种推荐的方式来处理这种事情？

供参考，典型的addThis用法......

<script type="text/javascript">
    var addthis_config = {
        "data_track_addressbar":false,
        "ui_click":true,
        "data_use_cookies": false
    };
</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#"></script>

<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_compact" title="Share"></a>
</div>

Answer 1

我想出了这个（如果有更好的方法，请告诉我。）

<script type="text/javascript">
    var addthis_config = {
        "data_track_addressbar":false,
        "ui_click":true,
        "data_use_cookies": false
    };

    $(window).on("load", function(){
        $('head')
            .append($('<script>')
            .attr('type', 'text/javascript')
            .attr('src', "http://s7.addthis.com/js/250/addthis_widget.js#"));        
    });
</script>

<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_compact" title="Share"></a>
</div>

Answer 2

看一下异步加载AddThis：

http://support.addthis.com/customer/portal/articles/381221-optimizing-addthis-performance#.UZFNACtAR7Q

至少，这将最大限度地减少加载时间（但幸运的是，AddThis已经在大多数计算机上缓存，因此加载时间非常短）。

Answer 3

以防有人仍在寻找解决方案。 AddThis已经发布许多人对页面延迟感到恼火，现在他们提供了几个选项，您可以在脚本中控制这些选项，以便在您（dom）准备就绪时加载：虽然您也可以使用动态加载或附加#async = 1来异步加载，但我认为另一个好的选择就是这样 - 在dom准备就绪之前不会运行：

<script type="text/javascript">


 /*
    //if you have a pub_id, add it here and uncomment these two lines
    var addthis_config = addthis_config||{};
    addthis_config.pubid = 'YOUR PUBID';
    */
    var addthisScript = document.createElement('script');
    addthisScript.setAttribute('src', 'http://s7.addthis.com/js/300/addthis_widget.js#domready=1')
    document.body.appendChild(addthisScript)
</script>

你可以read more here

延迟执行addThis

3 个答案: