javascript - 通过 AJAX 加载的 HTML 内容乱序加载外部 JavaScript

Question

这是场景，不确定我遗漏了什么。

• 页面 A.htm 向页面 B.htm 发出 ajax 请求，并将响应插入页面。

• Page B.htm 包含指向其他几个 JS 文件的链接，其中许多包含用于初始化它们的 document.ready() 函数。

这在 A.htm 和 B.htm 在同一台服务器上时工作正常，但在不同服务器上时则不然。

我认为我在这里看到的是，当页面 A 和 B 在不同的服务器上(跨域 ajax)时，外部资源被异步返回，或者至少是乱序的，因此脚本正在执行，期望 JQuery.UI 已经加载，但实际上并未加载。

感谢任何指点或建议。为糟糕的解释道歉。

Answer 1

您正在通过 jQuery 注入(inject) HTML + 脚本标签。在这种情况下 *:

• 除了脚本之外的HTML内容被注入(inject)到文档中
• 然后所有的脚本一个一个执行
• 如果脚本是外部的，那么它会被异步下载和执行

因此，依赖于 jQuery UI 的外部或内联脚本可能会在 jQuery UI 之前执行。

一种可能的解决方案是更改页面的工作方式:

• 摆脱 pageb.html 中的外部脚本，但保留内联脚本
• 在 pagea.html 中加载所需的脚本
• 加载pageb.html

另一种解决方案是推出您自己的 jQuery 函数，它将:

• 去掉所有<script src>来自 HTML 的元素
• 按顺序下载并执行这些脚本
• 注入(inject)剩余的 HTML

---

^{* 没有记录确切的行为。我不得不查看 source code推断细节。}