如何仅在延迟的 Javascript 外部文件加载后才执行 Javascript？

Question

我想推迟加载外部 Javascript 文件，直到页面加载完毕（而且我不想在无法加载这些外部资源时阻止呈现）。所以我有这条线

<script type="text/javascript" src=“//external.otherdomain.com/path/js/myresoures.js" defer></script>

但是，当这个文件最终加载时，我想运行以下…

<script type="text/javascript">_satellite.pageBottom();</script>

但是，按原样，上述内容可能运行在脚本加载之前。如何仅在加载远程资源后运行上述（或任何）Javascript？请记住，如果外部资源未加载（例如超时），我不想运行 Javascript.

谢谢，-戴夫

Answer 1

您可以使用 jQuery 的 $(window).load();

参见：http://api.jquery.com/load/

Answer 2

这可以通过 onload 函数来实现。

您可以动态加载每个...这个例子是从 MDN 中提取的。它将在您调用的脚本上方插入您的外部资源 importScript() 然后在加载后启动回调。

sSrc = 您的外部脚本，fOnload = 回调

function importScript (sSrc, fOnload) {
  var oScript = document.createElement("script");
  oScript.type = "text\/javascript";
  oScript.defer = true;
  if (fOnload) { oScript.onload = fOnload; }
      document.currentScript.parentNode.insertBefore(oScript, document.currentScript);
  oScript.src = sSrc;
}

用法：

importScript("//external.otherdomain.com/path/js/myresoures.js", function () { _satellite.pageBottom(); });

或者如果 jQuery 是一个选项，则使用 .getScript() 像这样：

$.getScript( "//external.otherdomain.com/path/js/myresoures.js", function () {_satellite.pageBottom();} );

这些选项中的任何一个都可以在页面末尾的 <script> 中使用，在折叠之后，如他们所说，确保整个 DOM 首先加载。

如何仅在延迟的 Javascript 外部文件加载后才执行 Javascript？

How do I execute Javascript only after a deferred Javascript external file has loaded?

javascript

resources

external

onload