javascript放在HTML中不同位置的区别

一个比较基础的问题: javascript放在head里和放在body里有什么区别?

1、先加载和后加载的区别。
浏览器解析html是从上到下的。如果把javascript放在head里,则先被解析。需要用window.onload起到一个延迟加载的作用。JavaScript脚本写在body里面,也要看具体位置。一般都是写在了body标签的最后面。
2、javascript代码默认是同步执行的,不管是内嵌的还是外部的javascript代码,都会阻塞后续html代码的加载和渲染以及后续javascript的解析。这是个必要的特性,试想一下,如果你要使用某个功能,例如jquery 库的功能,把jquery 库放在你是用的代码之前(一般放在head里),这样你在其后的任何位置都可以无限制的使用jquery 的功能而不用担心其jquery 函数功能是否已经被解析载入。
3、但如果你这有一个javascript文件比较大,而这一部分的功能比较独立,没有他也不会影响页面的显示效果,那就可以考虑把它放在body的最后,即/body之前,这样整个页面载入了,页面完全显示了才开始处理这部分javascript,当然,也可以loadjs 等异步加载方式进行异步加载,这样就不会阻塞其他html和javasscript了。
4、一般情况下最好是单独把javascript放在js文件里,通过head里的链接起来,css则是通过link。这样做的目的是为了让内容-样式-逻辑分离,以便以后能够更好地维护

  • 1
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值