扫码关注官方订阅号
按理说将js文件放在网站body底部能让页面更快的呈现出来,但我发现基本上所有的网站都在头部放了不少的js文件,同时开源程序也是这样,不知道这样做是什么原因呢?
业精于勤,荒于嬉;行成于思,毁于随。
如果在<script>里面加async属性,可以异步加载js文件,加载完时解析HMTL停止,等执行完JS之后继续解析HTML。如果<script>里面加defer属性,则异步加载js文件,等解析HTML结束之后,执行JS。所以,哪怕是把<script>放在head中,也可以实现“js文件放在网站body底部”的效果。
“我发现基本上所有的网站都在头部放了不少的js文件,同时开源程序也是这样”,恐怖不是吧,bootstrap demo page就是在body尾部加载JS的。
另外,如果用AMD,CMD,JS哪怕在HEAD上加载,也不会影响HTML解析速度。
放在末尾严格来说只是一个hack,是因为浏览器这样加载会更快而不得已而为之的手段,放在头部才是相对更加标准的形式
新手表示为了省写个window.onload。。。不过async和defer可以达到异步加载,,再者现在也都用上了amd cmd。。随便放吧,
如果只考虑新版浏览器的话,两种都差不多。不过放在head的时候最好还是加入 defer 属性。
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
如果在<script>里面加async属性,可以异步加载js文件,加载完时解析HMTL停止,等执行完JS之后继续解析HTML。
如果<script>里面加defer属性,则异步加载js文件,等解析HTML结束之后,执行JS。
所以,哪怕是把<script>放在head中,也可以实现“js文件放在网站body底部”的效果。
“我发现基本上所有的网站都在头部放了不少的js文件,同时开源程序也是这样”,恐怖不是吧,bootstrap demo page就是在body尾部加载JS的。
另外,如果用AMD,CMD,JS哪怕在HEAD上加载,也不会影响HTML解析速度。
放在末尾严格来说只是一个hack,是因为浏览器这样加载会更快而不得已而为之的手段,放在头部才是相对更加标准的形式
新手表示为了省写个window.onload。。。不过async和defer可以达到异步加载,,再者现在也都用上了amd cmd。。随便放吧,
如果只考虑新版浏览器的话,两种都差不多。不过放在head的时候最好还是加入 defer 属性。