总结：JS文件中引入其他JS文件的方法，以及＜script＞标签中间如何嵌套＜script＞标签

一·什么是JS文件？

（1）就是以“.js”扩展名结尾的文件

（2）JS文件里面，只能写入JavaScript代码，且文件首尾不能再加< script>< /script>标签；浏览器解析JS文件时，就会自动给JS文件内部的代码前后自动加上< script>< /script>标签

（3）引用JS文件的方法

<script type="text/javascript" src="/static/workflow.js"></script>

注意：script标签中的type类型也可以不加
1
2
3

（4）< script>< /script>标签尽量放在页面body的末尾，这样可以避免很多的重复渲染，从而可以提高系统的处理性能

二·如何在JS文件中引入其他的JS文件？

本质上相当于在页面的body或者head中引入一组新的script标签，从而实现引入新的JS文件；
而并不是两组script标签的直接互相嵌套，这样并不会有效果。
1
2

方案一：利用jQuery框架实现

以下的方法都是直接写在JS文件代码里面

（1）在body中添加（推荐使用）

$("body").append('<script src="/static/workflow.js"></script>')
1

（2）在head中添加

$("head").append('<script src="/static/workflow.js"></script>')
1

方案二：利用原生的JavaScript实现

以下的方法都是直接写在JS文件代码里面

（1）这行代码写在哪，他就在哪开始执行，并输出内容标签到document中。

document.write("");
1

（2）利用构造标签，再添加进去实现：

// 在页面head中添加新的script标签，从而引入新的JS文件
var script = document.createElement('script');
script.setAttribute('type','text/javascript');
script.setAttribute('src',url);
document.getElementsByTagName('head')[0].appendChild(script);
1
2
3
4
5

方案三：利用es6中export和import实现模块化，vue、react等框架也可以使用这种方法实现

（1）引入其他JS文件的变量或函数等

import {initData, peopleList} from './test';
1

（2）引入其他JS文件的全部代码模块，并立即执行

import './static/initData.js'
//立即执行initData.js文件代码，但不会在当前JS文件中引入任何变量、方法
1
2