html文件是自上而下的执行方式，但引入的css和javascript的顺序有所不同，css引入执行加载时，

程序仍然往下执行，而执行到<script>脚本是则中断线程，待该script脚本执行结束之后程序才继续往下执行。

所以，大部分网上讨论是将script脚本放在<body>之后，那样dom的生成就不会因为长时间执行script脚本而延迟阻塞，加快了页面的加载速度。

但又不能将所有的script放在body之后，因为有一些页面的效果的实现，是需要预先动态的加载一些js脚本。所以这些脚本应该放在<body>之前。

所以，我认为script放置位置的原则“页面效果实现类的js应该放在body之前，动作，交互，事件驱动的js都可以放在body之后”。

script放置最佳位置(转载)的更多相关文章

  1. script标签的位置

    1.在我们编写代码的时候,会在页面内使用<script>标签来写JS,虽然理论上script标签的位置放在哪里可以,但是还是有一点区别的. 2.为什么很多人把script标签放在底部: 初 ...

  2. JavaScript <script>标签的位置、延迟脚本（defer属性）与 异步脚本（async属性）

    一.<script>标签的位置 传统的做法是将<script>元素放在<head>元素中,例如: <!DOCTYPE html><html > ...

  3. [Spark内核] 第34课：Stage划分和Task最佳位置算法源码彻底解密

    本課主題 Job Stage 划分算法解密 Task 最佳位置算法實現解密 引言 作业调度的划分算法以及 Task 的最佳位置的算法,因为 Stage 的划分是DAGScheduler 工作的核心,这 ...

  4. Stage划分和Task最佳位置算法源码彻底解密

    本课主题 Job Stage 划分算法解密 Task 最佳位置算法实现解密 引言 作业调度的划分算法以及 Task 的最佳计算位置的算法,因为 Stage 的划分是DAGScheduler 工作的核心 ...

  5. 【转】【Python + selenium】linux和mac环境，驱动器chromedriver和测试报告HTMLTestRunner放置的位置

    感谢: 作者:gz_tester,文章:<linux和mac环境,chromedriver和HTMLTestRunner放置的位置> 使用场景 配置python selenium 环境 使 ...

  6. <Script>放置位置

    html文件是自上而下的执行方式 css引入执行加载时,程序仍然往下执行 script脚本是则中断线程,待该script脚本执行结束之后程序才继续往下执行 页面效果实现类的js放在body之前,动作, ...

  7. <script>元素的位置

    脚本元素会组织下载网页内容,浏览器可以同时下载多个组件,但一旦遇到一个外部脚本文本后,浏览器会停止进一步下载,知道这个脚本文件下载,解析并执行完毕.这会严重影响网页载入的总时间,特别是在网页在入时会发 ...

  8. JavaScript脚本在页面中放置的位置

    JavaScript脚本通常放置在三个位置: 1.head部分JavaScript脚本. 2.body部分JavaScript脚本. 3.单独以.js结尾的文件中的JavaScript脚本. 客户端会 ...

  9. jQuery最佳实践(转载)

    本文转载于阮一峰的博文. 上周,我整理了<jQuery设计思想>. 那篇文章是一篇入门教程,从设计思想的角度,讲解“怎么使用jQuery”.今天的文章则是更进一步,讲解“如何用好jQuer ...

随机推荐

  1. Codeforces 280C Game on tree【概率DP】

    Codeforces 280C Game on tree LINK 题目大意:给你一棵树,1号节点是根,每次等概率选择没有被染黑的一个节点染黑其所有子树中的节点,问染黑所有节点的期望次数 #inclu ...

  2. 高度注意 Map 类集合 K/V 能不能存储 null 值的情况

    集合类 Key Value Super 说明 Hashtable 不允许为 null 不允许为 null Dictionary 线程安全 ConcurrentHashMap 不允许为 null 不允许 ...

  3. python,java操作mysql数据库，数据引擎设置为myisam时能够插入数据，转为innodb时无法插入数据

    今天想给数据库换一个数据引擎,mysiam转为 innodb 结果 python 插入数据时失败,但是自增id值是存在的, 换回mysiam后,又可以插入了~~ 想换php插入试试,结果php数据引擎 ...

  4. 【java多线程】用户线程和守护线程的区别

    java中线程分为两种类型:用户线程和守护线程.通过Thread.setDaemon(false)设置为用户线程:通过Thread.setDaemon(true)设置为守护线程.如果不设置次属性,默认 ...

  5. 【spring源码学习】spring配置的事务方式是REQUIRED,但业务层抛出TransactionRequiredException异常问题

    (1)spring抛出异常的点:org.springframework.orm.jpa.EntityManagerFactoryUtils public static DataAccessExcept ...

  6. lapis 集成openresty最新版本cjson 问题的解决

    备注:    为了解决安装了lapis.同时又希望使用新版nginx 以及openresty 的特性(stream ...)   1. 解决方法 参考: https://github.com/leaf ...

  7. js写的体彩足球预测分析

    最近室友在玩世界杯的预测,我顺手写点分析:下面直接给出代码,很简单的,拷贝代码直接存为html文件就可以了.---------mq0036 说明下:需要你自己去找个Jquery引用到当前页面就可以了 ...

  8. Linux history时间用户ip设置

    Linux history时间用户ip设置        在使用linux服务器的时候发生一些不知道谁操作的问题,google一下说history命令可以查看到历史记录,用过之后发现还是不够详细,再g ...

  9. jdk1.8新特性之lambda表达式

    lambda表达式其实就是指一个匿名函数,应用最广泛的就是匿名内部类的简化.在jdk1.8之前,我们定义一个匿名内部类可能需要写一大坨代码,现在有了lambda之后,可以写的很简洁了.但不是说lamb ...

  10. 框架（yii和thinkphp）中实例化php内置或者扩展中的对象问题

    将php原生语句实例化SphinxClient对象移植到yii2框架中报错 原生语句中这样写: $s = new SphinxClient(); 框架中应该加入反斜杠,这样写: $s = new \S ...