如何在没有膨胀的情况下在HTML索引文件中导入多个javascript文件？

Question

有没有在HTML中导入多个javascript文件而不必指定每个文件？

<script src="js/toolkit/Toolkit.js"></script>
<script src="js/toolkit/Viewable.js"></script>
<script src="js/toolkit/Overlay.js"></script>

即.我可以指定像js/toolkit/*这样的东西吗？

我有50多个javascript文件,我必须导入,并指定每个文件似乎非常耗时.

Answer 1

有一种方法:

您可以创建一个javascript函数,将路径作为参数并创建以下HTML行:

<script src="js/toolkit/Toolkit.js"></script>
<script src="js/toolkit/Viewable.js"></script>
<script src="js/toolkit/Overlay.js"></script>

而你只需要这样称呼:

loadLib("toolkit/Toolkit");
loadLib("toolkit/Viewable");
loadLib("toolkit/Overlay");

但不推荐这样做,因为由于HTTP请求的数量,加载时间会增加.您最好在服务器端使用某些东西将所有内容放在同一个文件中.

Answer 2

在另一个JavaScript文件中包含JavaScript文件在Web开发中很常见.

因为很多时候我们代表某些条件在运行时包含JavaScript文件.

所以,我们可以使用JavaScript以及使用jQuery来实现这一点.

方法1:使用JavaScript包含另一个JavaScript文件

1. 在您的网页中添加以下功能.

   function loadScript(url)
   {    
       var head = document.getElementsByTagName('head')[0];
       var script = document.createElement('script');
       script.type = 'text/javascript';
       script.src = url;
       head.appendChild(script);
   }
   

2. 只需调用下面的loadScript函数,在其中包含js文件.

   loadScript('/js/jquery-1.7.min.js');
   

方法2:使用jQuery包含另一个JavaScript文件.

1. 在您的网页中添加jQuery文件.

   <script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
   

2. 只需调用getScript函数函数即可.

   jQuery(document).ready(function(){
       $.getScript('/js/jquery-1.7.min.js');
   });
   

如何在另一个JavaScript文件中包含JavaScript文件

Answer 3

不,你做不到.顺便说一下,加载所有50个单独的文件并不是一个好主意.考虑在一个脚本中压缩它们以提高性能并减少页面加载时间.

Answer 4

您可以设置咕噜到看剧本和文件夹CONCAT/再压缩成一个单一的文件,那么你就必须包括在HTML文件中.