0

“降级脚本标签” http://ejohn.org/blog/degrading-script-tags/和脚本 DOM 元素的组合是异步加载外部 JavaScript 并与内联代码耦合的一个很好的模式。

Steve Souders 在这篇文章中很好地描述了这种组合:http: //www.stevesouders.com/blog/2008/12/27/coupling-async-scripts/

基本上,一旦外部脚本加载,页面上的脚本就会由外部脚本触发。我一直想知道如果下载外部脚本时运行的脚本尝试添加事件处理程序会发生什么。DOM 可能未完成加载,因此添加事件处理程序可能会失败。

然而,Steve Souders 的文章非常透彻,甚至继续讨论了延迟加载。这意味着在页面加载之前不会下载外部脚本(因为添加到 DOM 的脚本元素是在 window.onload 中完成的)。这确保添加的事件处理程序应该起作用。

所以一切看起来都很好,但我留下了一个琐碎的问题——假设我们已经等待页面加载,用户可以与页面交互,甚至可能在添加事件处理程序之前离开页面。

我的琐事是一个有效的担忧吗?如果是这样,是否有可靠的方法来解决它?

谢谢,保罗

4

1 回答 1

0

您可以在加载时将脚本元素添加到 DOM。只需在您的内联脚本中获取对 head 元素的引用并注入您的资产。通过这种方式,您可以在渲染 DOM 时触发浏览器加载外部脚本。

你是对的,因为注入的脚本被加载到内存中并不意味着 DOMContentLoaded 事件已经触发。您必须侦听该事件才能在加载所有外部资产时触发的回调中执行与 DOM 相关的操作。

于 2013-07-19T11:53:44.957 回答