将JavaScript插入到HTML的主要方法是使用< script >这个标签，这个标签有八个属性，但是language属性被废弃了，下面我们来讲一下以下七个属性
src ：可选。表示包含要执行代码的外部文件
type：可选。表示脚本语言的类型（MIME类型）
async：可选。表示应该立即下载脚本，但不能阻止其他的页面动作
defer：可选。表示脚本可以延迟到文档完全被解析和显示之后再执行
charset：可选。使用src属性指定的代码字符集
crossorigin：可选。配置请求跨域的相关设置。默认不使用
intergrity： 可选。允许对比接受到的资源和指定的加密签名以验证资源的完整性
使用< script >有以下两种方式
嵌入式：
<script> function aoteman () { console.log("Hi,DiJia!") } </script>
引用式：此时要使用到上面提到的src属性
<script src='aoteman.js'></script>
注意：如果使用了src属性的话，就不应该在标签内再写嵌入式脚本代码了。因为如果两者都的话，浏览器只会下载并执行脚本文件，从而忽略行内代码；
另外，src属性还有一个强大的特性，它可以引用外部域的脚本噢，比如这样子一搞。
<script src='http://www.aoteman.com'></script>
那么，执行顺序是什么样子呢？
不管包含什么代码，在没有使用defer和async属性的情况，浏览器都会按照< script >在页面出现的顺序执行它们。
一般会把标签放在页面内容的后面body结束标签的前面来执行，这是为什么呢？
看下面两段代码：
<!DOCTYPE html> <html> <head> <title>ni xiang xing guang ma </title> <script src='http://www.aoteman.com'></script> </head> <body> <!-- This is the page content --> </body> </html>
<!DOCTYPE html> <html> <head> <title>ni xiang xing guang ma </title> </head> <body> <!-- This is the page content --> <script src='http://www.aoteman.com'></script> </body> </html>
这两段代码有什么区别呢？
第一段代码意味着必须把所有的JavaScript代码都下载、解析、和解释完成后，才开始渲染页面，这会导致页面渲染的明显延迟，在此期间，浏览器窗口完全空白。假若把标签放在页面内容后就会先渲染页面内容，然后再下载、解析、和解释脚本了；
在< script>元素上设置defer属性，告诉浏览器立即下载，但是延迟执行哈。我先去渲染
比如这样
<html> <head> <title>ni xiang xing guang ma </title> <script defer src='aoteman.js'></script> <script defer src='aoteman2.js'></script> </head> <body> <!-- This is the page content --> </body> </html>
这样一来，两个脚本文件会在浏览器解析到< /html>标签后才执行，而且第一个脚本文件会在第二个脚本文件之前执行，两者都会在DOMContentLoaded事件之前执行；
注意：defer属性只对外部脚本文件才有效
3、异步执行脚本在< script>元素上设置async属性，告诉浏览器立即下载，但是并不能保证能按照它们出现的次序执行
比如这样
<html> <head> <title>ni xiang xing guang ma </title> <script async src='aoteman.js'></script> <script async src='aoteman2.js'></script> </head> <body> <!-- This is the page content --> </body> </html>
这样，第一个脚本可能优先于第二个，也可能第二个优先于第一个执行。异步脚本保证在页面的load事件之前执行，但是可能会在DOMContentLoaded之前或者之后。
注意：使用async也会告诉页面你不会使用document.write,不过好的Web开发实践根本不推荐使用这个方法；
4、动态加载脚本除了< script>标签，还有其他方式可以加载脚本，只要创建一个script元素并将其添加到DOM即可。就像这样一搞就可以了。
let script =document.createElement('script'); script.src = 'aoteman.js' document.head.appendChild(script);
默认这样是异步加载的哈，相当于添加了async属性，你也可以将其设置为同步的，就像这样
let script =document.createElement('script'); script.src = 'aoteman.js' script.async = false; document.head.appendChild(script);
如果你想让于加载器知道这些动态请求文件的存在，可以在文档头部显示声明它们：
<link href='aoteman.js'>
最后XHTML因为退出历史舞台，我就不详细说了，如果有兴趣了解的小伙伴，自行百度噢！
5、行内代码于外部文件虽然可以直接在html文件中嵌入JavaScript代码，但通常认为最佳的实践是尽可能将JavaScript代码放在外部文件中；因为这样：
可维护性强，JavaScript如果分散到很多的HTML页面，会导致维护困难，而用一个目录保存所有的JavaScript文件，则更容易维护；
缓存：如果两个页面用到同一个文件，只需要下载一次，
适应未来：（说实话我也没看大懂，书上说什么获取外部文件的带宽、缓存啥的，没必要弄懂我觉得，想要知道的姐妹可以百度噢！）
