放在body中：在页面加载的时候被执行

放在head中：在被调用时被执行

原因：

1、浏览器是从上到下解析HTML的。

2、放在head里的js代码，会在body解析之前被解析；放在body里的js代码，会在整个页面加载完成之后解析。

js应该放哪：

1、head中：需调用才执行或事件触发执行的脚本，可以保证脚本在调用之前被加载

2、body中：当页面被加载时执行的脚本，通常被用来生成页面内容

script放在body和放在head的区别的更多相关文章

  1. vue.js引用出错-script代码块放在head和body中的区别

    这篇随笔是为了记录vue.js引用出错的原因,看到最后原来是vue.js代码放在head中不能正常使用,要最后发现要将其放在body中才行... 原来是js代码放在head和body中的区别问题,占个 ...

  2. (转)script标签到底该放在哪里

    一般script标签会被放在头部或尾部.头部就是<head>里面,尾部一般指<body>里[4-5]. 将script放在<head>里,浏览器解析HTML,发现s ...

  3. script 写在body和head的区别（WEUI中使用swiper删除）

    区别简述: 在HTML body部分中的JavaScripts会在页面加载的时候被执行.在HTML head部分中的JavaScripts会在被调用的时候才执行.   JavaScript应放在哪里 ...

  4. js script放在head和body里面的区别

    详见: http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp66       java script放在head和body的区别   ...

  5. JS代码放在head和body中的区别分析

    最近一直在忙工作,没有时间来写博客了,不过今天做网站的时候碰到一个问题就是JS脚本存放的位置不同其效果不同.起初我没在意这个问题,后来一直解决不了,通过上网与查资料问同事,终于我明白了,原来我碰到了这 ...

  6. java中new一个对象放在循环体里面与外面的区别

    首先说下问题: 这次在做项目的是出现了一个new对象在循环里面与外面造成的不同影响. 大家可以看到这个new的对象放在不同的位置产生的效果是不一样的. 经过多方查询与验证可以得出结论: * EasyU ...

  7. <script>标签中的 defer 与 async区别

    在html里,使用<script>标签对脚本进行外部或内部引用,<script>标签包含了两个特殊的属性:defer与async,他们的区别如下: 1.若<script& ...

  8. Vue.js学习笔记-script标签在head和body的区别

    初学JavaScript,项目需要没有系统学习,只能边查资料边码代码,埋下的坑不知道有多少,还是建议时间充足的情况下系统的将Javascript学习一遍 ,涉及的HTML知识也务必了解. 问题 最开始 ...

  9. script标签中defer和async的区别（稀土掘金学习）

    如果没有defer或async属性,浏览器会立即加载并执行相应的脚本.它不会等待后续加载的文档元素,读取到就会开始加载和执行,这样就阻塞了后续文档的加载. 下图可以直观的看出三者之间的区别: 其中蓝色 ...

随机推荐

  1. lombok版本过低报错

    调试报错Error:java: java.lang.ExceptionInInitializerError  com.sun.tools.javac.code.TypeTags JAVA12调整原有项 ...

  2. 任意指定一个key获取该key所处在哪个node节点

    需求:任意指定一个key获取该key所处在哪个node节点上. 说明:redis自带的命令可以知道一个key所属的slot,可以知道node master对应哪些slot,但没有key和node的对应 ...

  3. node常用模块汇总

    node常用模块汇总: 点击插件名字,查看使用文档 npm常用模块汇总 node常用模块汇总 gulp常用插件汇总 mkdirp:在node.js中像mkdir -p一样递归创建目录及其子目录

  4. Python中BaseException和Exception的区别

    BaseException 是 Exception 的父类,作为子类的Exception无法截获父类BaseException类型的错误 BaseException: 包含所有built-in exc ...

  5. RocketMQ解决幂等性问题

    一.造成重复消费的原因 在于回馈机制.正常情况下,消费者在消费消息时候,消费完毕后,会发送一个ACK确认信息给消息队列(broker),消息队列(broker)就知道该消息被消费了,就会将该消息从消息 ...

  6. DataGridView只显示数据源中绑定的字段

    场景: 由于环境需要,在获取数据源的时候会获取多于DataGridView中绑定的字段,若不做任何处理,直接将数据源绑定到DataGridView上面,DataGridView就会将数据源中没有绑定的 ...

  7. 日常问题--解决 ‘Could not fetch URL https://pypi.python.org’的问题

    难题描述: 解决方法: 使用命令python -m pip install Scrapy  --trusted-host=pypi.python.org --trusted-host=pypi.org ...

  8. 更改pip为豆瓣源加速下载

    需求 Python默认pip下载太慢,更改pip为豆瓣源 文件位置 Git Bash Windows $ vi ~/pip/pip.ini Linux $ vi ~/.pip/pip.conf 内容 ...

  9. Unable to open debugger port (127.0.0.1:13249): java.net.BindException "Address already in use: JVM_Bind"

    这个问题比较简单一点,Tomcat的端口被占用了,我使用的是IDEA里的一个热部署插件JReble,更新了IDEA之后就发现端口被占用了,可能我电脑没有重启过吧, 一直被占用着,所以解决方法就是更换一 ...

  10. 18新生赛 4. Deal

    题目描述:双十一过后,syx发现自己快要吃土了.但是机智的他决定理财.他预测了将来n天的比特币行情,发现有涨有跌,有跌有涨.手里的钱只要在比特币的浪潮中经历沉浮,低价收入,高价卖出,就可以轻易割到别人 ...