延迟加载JavaScript的最佳做法

Question

动态加载HTML内容并将其注入页面的最佳方法是什么（当HTML同时包含<script src="..." />标记和对这些脚本的函数调用时）？

考虑这种方法（为简单起见，我将考虑使用jQuery）：

<script>
$.ajax({
    url: 'http://...',
    success: function(html) {
        $("body").append(html);
    }
});
</script>

假设返回的html包含以下内容：

<script src="some_script.js"></script>
<script>
some_function(); // function defined in some_script.js
</script>

由于some_function()是在some_script.js中定义的，因此只有在some_script.js加载后才可用，但（通常）它将在some_script.js加载之前执行（从而导致错误）。

显然，有一些解决方案可以解决此问题，但是这种情况下的最佳实践是什么？ 应该改用诸如RequireJS之类的库吗？

上面的示例是我使用模式的结果：我有一个仅在将要使用它时才加载的组件（那时，我进行Ajax调用以同时检索HTML和所需的脚本）。 尽管如此，仍然可能会需要许多脚本，并且将它们作为一组标签写在HTML模板中要比通过JavaScript加载更为容易（这也是首选方法，因为脚本URL可能在应用程序内部生成，因此使用纯JS脚本可能不知道绝对脚本URL）。

Answer 1

实际上，Safari和Internet Explorer（以及最有可能的其他浏览器）不会执行通过Ajax注入的<script>作为安全措施。

我的建议是，当您需要一个相当大的库（但实际使用Web应用程序并不需要）时，是将包含该库的.js文件加载到文档中，之后您可以使用所有库中定义的属性和方法。 将回调侦听器附加到脚本加载器，并执行回调中的所有代码，而不是外部.js文件本身。