说明

有时候我们需要在一个js文件中引入另外一个js文件，例如有多个html需要用到两个js文件，而我们想减少每个页面引用js文件的个数，如果在一个js文件中引用了另外一个js文件，那么我们在多个html页面中就可以只引用一个js文件了，下面总结几种实现方式：

方式1：document.write

在调用文件的顶部直接加入如下代码：

document.write("<script src='js/encryptionJS/SM-NoModule.js'><\/script>");

由于这种方式是异步加载，document.write会重写界面，不实用。而且谷歌浏览器会报警告Parser was blocked due to document.write()

方式2：jQuery的$.getScript

$.getScript("test.js",[callback]); //url

$.getScript方法是异步加载js文件，为了避免js执行出现逻辑顺序错误的问题，被加载的js文件中最好不要有函数执行的操作；

$.getScript可接受第二个参数，这个参数是一个回调函数，当js文件加载完成后，此回调函数执行，相应的业务逻辑（例如ajax请求）可以在此函数中调用。

方式3：动态创建script元素（异步）

<script type="text/javascript">
      function loadJs(url){
        var script=document.createElement('script');
        script.type="text/javascript";
        script.src=url;
        document.body.appendChild(script);
    }
    loadJs("main.js");
    loadJs("tooltip.js");
    loadJs("button.js");
    loadJs("bootstrap.js");
</script>

方式4:

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

总结

1、网上有一种说法是不推荐使用document.write的方式，但是我刚开始用的是jQuery的$.getScript，发现有问题，换成document.write以后就好了。

参考资料

https://blog.csdn.net/weixin_39291021/article/details/105389634

https://www.jb51.net/article/195401.htm