1. <script>通常用于加载外部文件，当<script>用于加载外部文件时，它可以放在<head>中，也可以放在<body>中，当<script>放在head中时，浏览器必须等到<script>标签加载并运行外部文件代码后，页面才能开始渲染，之前页面都是空白。因而这是将<script>放在<head>中不好的一面。那么好的一面:如果整个页面必须依赖<script>外部文件才能够有正常的行为，那么放在<head>中是一个极好的方法。至于其他的<script>文件，最好放在<body>底部，最好放在<body>底部。最好放在<body>底部。因为放在<body>底部时，整个页面已经渲染完成了，进入页面的速度不会显得太慢。
2. 将多个<script>标签合成一个比同时加载多个标签要好。
3. HTML4为<script>定义了一个扩展属性，defer,这个defer属性指明元素中所包含的脚本不打算修改DOM，从而代码可以稍后执行。从而方便浏览器进行优化。
4. defer 与 async的区别
两者相同点：
异步加载
<script>标签的defer属性——告诉浏览器该脚本不会在页面加载完成之前操作DOM，脚本将会和其他资源文件并行下载；
<script>标签的async属性——HTML5新的异步、并行模式，脚本将在完成下载后等待合适的时机执行代码。
回调初始化：
<script async src="myAsyncScript.js" onload="myInit()"></script>
<script defer src="myDeferScript.js" onload="myInit()"></script>
两者区别：
async 脚本在script文件下载完成后会立即执行,并且其执行时间一定在 window的load事件触发之前。这意味着多个async脚本很可能不会按其在页面中的出现次序顺序执行。
与此相对，浏览器确保多个 defer 脚本按其在HTML页面中的出现顺序依次执行,且执行时机为DOM解析完成后，document的DOMContentLoaded 事件触发之前。
5. 如果多个文件的次序非常重要，最好能将其练成一个文件。
浙公网安备 33010602011771号