如何在JavaScript中导入/包含源文件？

Question

  

可能重复：
  How to include js file in another js file?

假设我有一些JavaScript源文件：a.js，a1.js和a2.js。 a.js的功能调用来自a1.js和a2.js的函数。

现在我必须在HTML页面中声明所有这些文件。我想在HTML中声明a.js，在a1.js源文件中声明“导入/包含”a2.js和a.js。

有意义吗？我可以用JavaScript做到吗？

Answer 1

您无法在vanilla javascript中指定导入。

所以你的解决方案（不包括繁重的服务器端框架）是：

• 只需执行导入

即可

• 连接你的js文件（并在同一步骤中缩小它们，例如使用closure compiler）

• 使用像require.js

这样的模块itool

只要您没有经验，并且您的文件数量较少（少于15个），我建议您只选择第一个或第二个解决方案。在开始学习javascript时，使用模块加载器可能会产生您不想调试的副作用。

Answer 2

您可以导入：

<script type="text/javascript"src="a1.js"></script>
<script type="text/javascript"src="a2.js"></script>
<script type="text/javascript"src="a3.js"></script>

如果你想直接从JS那里做，你可以使用Ajax，这篇文章解释了如何： include-javascript-file-inside-javascript-file

Answer 3

您可以使用某些工具将JavaScript（以及CSS）文件捆绑在一起，以减少必须包含的文件数量。这也增加了页面加载性能。

这些工具将多个JavaScript文件合并为一个JavaScript文件（可选择将文件缩小），并将多个CSS文件合并为一个CSS文件。这导致从浏览器到服务器的HTTP连接更少，因此连续提取的内容更少。

ASP.Net MVC 4内置了对此的支持：

http://theshravan.net/bundling-and-minification-support-in-asp-net-mvc-4/

其他环境也有很多解决方案，例如Juicer。

如果您无法捆绑所有资源（可能某些资源来自CDN而其他资源是本地服务的），您可以使用负载管理器，例如require.js。