首先我们要知道两点：
(1) 浏览器在遇到<body>元素才开始显示内容;
(2) 当HTML页面中含有外部的JavaScript代码引用，会首先对其进行下载，解析。
在最初的写法中，我们都将<script>元素写在HTML页面的<head>元素中。
这样写的好处是：把所有的外部文件(即.css文件和.js文件)的引用都放在了相同的位置。
但是这样就会产生一个问题：
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="text.js"> </script>
<script type="text/javascript" scr="test.js"> </script>
...
</head>
<body>
</body>
</html>由(2)我们知道，当有很多<script>元素时,代码会在<head>标签中等待过长的时间，此时浏览器也不能显示任何页面，这种交互体验...
所以我们推荐将<script>元素写在<body>元素中页面内容的后面。这样在解析包含的JavaScript代码之前，页面的内容都已经完全显示在浏览器中，相应的体验就会好很多。
扫描二维码关注公众号，回复：
9725089 查看本文章
<html>
<head>
</head>
<body>
...
<script type="text/javascript" src = "test.js">
</script>
</body>
</html>