使用 JQuery 在 WordPress 上加载页面后运行 JavaScript

Question

我是 JS 新手，我仍在努力理解这一切。所以我决定给自己做几个项目，这样我就可以学习语法了。

我有一个聊天小部件，当有人登陆我的网站时会加载它。但是，我想只在页面加载后运行此小部件以提高网站性能。

如何调整此脚本以仅在我的 WordPress 网页加载后运行？

<!--Start of Tawk.to Script-->
<script type="text/javascript">
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/...../default';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
</script>
<!--End of Tawk.to Script-->

更新：小部件开发人员建议这样做。

<!--Start of Tawk.to Script-->
<script type="text/javascript">
var w = window;
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
function l() {
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/...../default';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
}
if (w.attachEvent) {
w.attachEvent('onload', l);
} else {
w.addEventListener('load', l, false);
}
})();
</script>
<!--End of Tawk.to Script-->

Answer 1

如果您希望在页面解析后加载它，请添加 defer 到脚本标签

<script type="text/javascript" defer>

否则在其他所有内容之后加载它在窗口加载时调用它：

    window.onload = () => {

    var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
        (function(){
        var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
        s1.async=true;
        s1.src='https://embed.tawk.to/...../default';
        s1.charset='UTF-8';
        s1.setAttribute('crossorigin','*');
        s0.parentNode.insertBefore(s1,s0);
        })();

    }

Answer 2

如果你使用 jQuery，你可以使用

$(document).ready(function(){});

在用户加载页面后运行 javascript。