如何等待document.write完成

Question

我正在尝试编写一些脚本回退代码,以便如果从CDN无法获得jQuery和jQuery Validator,我会加载本地版本.请注意,以下脚本位于单独的文件中以支持内容安全策略(CSP).

(window.jQuery || document.write('<script src="/js/jquery.js"><\/script>'));
($.validator || document.write('<script src="/js/jquery-validate.js"><\/script>'));

如果jQuery不可用,则会在文档的末尾写入新的脚本标记,但接下来的行错误表明$未定义.在执行下一行之前,如何等待文档写入完成加载文档？

Answer 1

你应该利用的onload事件<script>.而不是ducoment.write通过DOM操作向文档添加脚本标记:

var s = document.createElement('script');
s.onload = function() {
  // jQuery is now loaded and can be used
}
s.src = '/js/jquery.js';
document.getElementsByTagName('head')[0].appendChild(s);

更新:

你的问题'如何等待document.write'的答案是你不必因为document.write是同步的.后一行document.write只会在write方法完成写入后执行.但是,如果<script>使用src属性将标记写入文档,则资源的加载(src指向的位置)将是异步的,并且将在使用下一个语句的paralell中写入完成后开始.因为不可能事先告诉资源加载需要多长时间,所以确保从外部脚本获得所有内容的唯一可行方法是onload事件.