javascript - 如何让 TripAdvisor 小部件在 WordPress 页面上的其他所有内容之后加载

Question

本周，我开始为一位经营旅游公司的家庭成员开发我的第一个 WordPress 网站，该成员有一个非常过时的网站，我决定从头开始构建该网站。

一切都很顺利，直到我决定将他的一些 TripAdvisor 小部件添加到页面上。

小部件加载速度极其缓慢，这很烦人，但最糟糕的是它们在页面加载之前执行，这会导致极其明显的挂起和糟糕的“弹出”效果，因为页面最终可以在小部件之后完成加载。

这是 TripAdvisor 小部件的示例

<div id="TA_rated837" class="TA_rated">
<ul id="MpoP9sbYWV" class="TA_links Zw2KlSEGHzT">
<li id="qvZzYWwC2J" class="3qkrdfE">
<a target="_blank" href="https://www.tripadvisor.co.uk/"><img src="https://www.tripadvisor.co.uk/img/cdsi/img2/badges/ollie-11424-2.gif" alt="TripAdvisor"/></a>
</li>
</ul>
</div>
<script src="https://www.jscache.com/wejs?wtype=rated&amp;uniq=837&amp;locationId=3507299&amp;lang=en_UK&amp;display_version=2"></script>

该标记导致另一个脚本封装在 document.write 中，该脚本只能在页面加载时执行，我收集的内容是删除任何现有的 HTML？

document.write( '<script src="https://www.tripadvisor.com/WidgetEmbed-rated?amp;locationId=3507299&amp;lang=en_UK&amp;display_version=2&amp;uniq=837"></script>' );

当我发现 PostScribe 可用于在页面加载后触发 docment.wite 时，我以为我找到了一种触发脚本的方法。但由于页面已经加载，因此任何脚本都无法触发。

我还尝试复制拉入的最终函数并将其包装在我自己的函数中以在页面加载后触发。但是要执行此操作，我必须开始编辑 TripAdvisor 小部件代码，这违反了他们的使用条款。

他们确实有 API，但只有超大型企业才能访问。

我的网站目前仍然是本地的，但我创建了一个 fiddle 来演示我的问题。

https://jsfiddle.net/9z1r77Le/

我希望这里有人找到了解决方法和过去，因为我确实看到过这些小部件异步加载的网站。

提前致谢!

Answer 1

将 TripAdvisor '' 移至页面末尾解决了我的问题...

   </body>
   <!-- //end of body-->
   <script src="https://www.jscache.com/wejs?wtype=...></script> 
   <script src="https://www.jscache.com/wejs?wtype=...></script> 
   <script src="https://www.jscache.com/wejs?wtype=...></script> 
</html>
<!-- //end of Document -->

我觉得自己像个白痴，因为我花了很长时间才解决这个问题，但希望这能在某个时候对其他人有所帮助。