行内代码与外部文件
我们都知道，可以直接在HTML里面写入JavaScript，不过这看起来比较臃肿，所以我们一般都是单独写一个JavaScript的外部文件用于导入进去，为啥要这么做呢
使用外部JavaScript的理由
- 可维护性
如果我们在HTML里面写入JavaScript，你将会发现如果我们想改动一个页面，上下分析起来会很麻烦（因为有时候我们还会牵扯到CSS文件），如果我们都用一个目录来管理我们的JavaScript文件，并且做好命名规范，就会更加容易维护，开发者也能提高开发效率
- 缓存
我们在前几个系列提高过：浏览器会根据特定的设置缓存所有外部链接的JavaScript文件，这意味着如果两个页面都应用到同一个文件里面，则只需要下载一次，大大加快了页面加载速度
- 适应未来
如果我们能够把JavaScript放到外部文件中，我们就不用考虑XHTML或前面提到的注释黑科技，包含外部JavaScript文件的语法在HTML和XHTML中是一样的
我们在配置浏览器请求外部文件时，要重点考虑的一点就是占用带宽，在SPDY/HTTP2中，消耗已经显著降低
举个栗子
<script src="demo1.js"></script> <script src="demo2.js"></script> <script src="demo3.js"></script> <script src="demo4.js"></script>
后续页面可能会包含下面的脚本
<script src="demo5.js"></script> <script src="demo6.js"></script> <script src="demo7.js"></script> <script src="demo8.js"></script>
我们在执行初次请求的时候，如果浏览器支持SPDY/HTTP2，我们就可以从同一个地方去的一批文件并将他们逐个放到浏览器缓存中。我们从浏览器的角度来看，通过SPDY/HTTP2获取所有这些独立的资源与获取一个大JavaScript文件的延迟差不多。在第二个页面请求时，由于我们已经把应用程序切割成了轻量可缓存的文件 ，第二个页面也依赖的某些组件此时已经存在于浏览器缓存中了
额外补充
当然，如果我们这里假设浏览器支持SPDY/HTTP2，只有比较新的浏览器才满足，如果还想支持老版本的浏览器，那还是用一个大文件比较合适
文档模式
身世背景
IE5.5发明了文档模式，可以使用doctype切换文档模式，一开始有两种，分为：混杂模式和标准模式，前者像IE5一样，后者让IE具有兼容标准的行为。虽然这两种模式主要区别只体现在通过CSS渲染的内容方面，但是对JavaScript也有一定的关联影响
在IE初次支持文档模式切换之后，出现了第三种文档模式：准标准模式，这种模式下的浏览器支持很多标准的特性，但是没有标准规定的那么严格，主要区别在于如何对待图片元素周围的空白（在表格中使用图片时最为明显）
混杂模式
混杂模式在所有浏览器中都以省略文档开头的doctype声明作为开关，这种约定不合理！ 因为混杂模式在不同浏览器中的差异非常大，不使用 “科技与狠活” 根本就没有浏览器一致性可言
<!-- HTML 4.01 Script --> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dcd"> <! -- XHTML 1.0 Script --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Script//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dcd"> <!-- HTML5 --> <!DOCTYPE html>
准标准模式通过过渡性文档类型（Transitional）和框架集文档类型（Frameset）来触发
<noscript>元素
由于早期的浏览器不支持JavaScript，所以我们需要一个页面优雅降级处理方案，所以，<noscript>应运而生，用于给不支持JavaScript的浏览器提供替代内容，但是现在主流的浏览器都开始支持JavaScript了，不排除仍然有些浏览器不支持JavaScript，所以对它们来说，这个元素仍然有它的用处
<noscript>元素可以包含仍和可以出现在<body>中的HTML元素，<script>除外，在下面两种情况下，浏览器会显示<noscript>中的内容
- 浏览器不支持脚本
- 浏览器对脚本的支持被关闭
如果任何一个条件被满足，包含在<noscript>中的内容就会被渲染，否则，浏览器不会渲染<noscript>中的内容
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script defer="defer" src="demo1.js"></script> <script defer="defer" src="demo2.js"></script> </head> <body> <noscript> <p>This page requires a JavaScript-enabled browser. </p> </noscript> </body> </html>
这个例子是在脚本不可用的时候让浏览器显示一句话，如果浏览器支持脚本，用于永远不会看见这句话
小结
JavaScript是通过<script>元素插入到HTML页面中的，这个元素可以把JavaScript代码嵌入到HTML，跟其它标记混合在一起，也可以用于引入保存在外部文件的JavaScript
- 要包含外部的JavaScript，咱就得把src属性设置为包含文件的URL，文件跟网页可以在同一台服务器上，也可以位于不同的域
- 所有的
<script>元素都会按照出现顺序依次执行，在不使用defer和async的情况下，代码必须严格按照次序执行 - 对于不推迟的及哦啊本，浏览器必须完全解释完位于
<script>中的代码，然后接着渲染，所以我们通常把<script>元素放到页面末尾，介于主内容之后及</body>标签之前 - 可以使用
defer属性把脚本推迟到文档渲染完毕之后再执行，推迟的脚本原则上按照它们被列出的次序执行 - 可以使用
async属性表示脚本不需要等待，同时也不阻塞文档渲染，即采用异步加载，但是异步加载不能保证按照它们出现的先后次序依次执行 - 通过使用
<noscript>元素，可以指定在浏览器不支持脚本时显示的内容，如果浏览器支持并且开启脚本，则<noscript>元素中的任何内容都不会被渲染
