谷歌翻译元素-加载后页面准备好了

Google translate element - load after page ready

本文关键字：准备好了 加载 翻译 元素 谷歌      更新时间：2023-09-26

我在我的页面上使用谷歌网页翻译元素。对于那些不知道它是什么你可以在这里找到:http://translate.google.com/translate_tools

它使用javascript加载页面。我把它嵌入在我的页面顶部，导致我的其余内容停止加载，直到翻译栏完成它的加载。

我怎么能延迟javascript运行，直到我的页面已经完全加载??

脚本如下:

<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'en',
    includedLanguages: 'da,nl,en,fi,fr,it,no,ru,es,sv',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

另一种方法是异步加载google translate 

<div class="custom-translate" id="google_translate_element"></div>
<!-- ASYNCHRONOUS Google Translate -->
        <script type="text/javascript">
        function googleTranslateElementInit() {
          new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.InlineLayout.SIMPLE, autoDisplay: false},'google_translate_element');
        }
        (function() {
          var googleTranslateScript = document.createElement('script');
          googleTranslateScript.type = 'text/javascript';
          googleTranslateScript.async = true;
          googleTranslateScript.src = '//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit';
          ( document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0] ).appendChild( googleTranslateScript );
        })();
        </script>   
    <!-- End script -->

正如John Conde所评论的那样，我将脚本放在页面底部，然后，页面加载

相关文章：