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. linux自学（二）之centos7镜像安装

    上一篇:linux自学(一)之vmware虚拟机安装 虚拟机安装完成之后,就可以安装centos镜像了 centos官网:https://www.centos.org/ centos7镜像 由于我的电 ...

  2. static类和no static类的区别

    1.static类,只能有静态成员,不能被实例.静态的东西在内存中只有一份,调用速度会快,但是相对费内存. 2.在另外一个类内部定义的类,此类的实例化不希望依赖外部类的实例化,此时可以定义为静态类(即 ...

  3. C#读取Excel数据操作大全

    苦丁茶 发表于 2014-02-10 12:58:00 | 分类标签: ASP.NET 读取Excel 本文介绍下,用C#读取excel数据的例子,包括读取整个工作薄的数据.读取工作薄选定区域中的数据 ...

  4. elixir 集成ejabberd

    备注: 我开发测试的环境时centos 1. 预备环境 1. openssl yum install -y  openssl-devel 2. xml yum install -y expat-dev ...

  5. hoverfly api 模拟框架了解

    What is Hoverfly? Hoverfly is a lightweight, open source API simulation tool. Using Hoverfly, you ca ...

  6. Java多线程编程核心技术，第一章

    1,Java并发--详解this与Thread.currentThread()的区别:https://blog.csdn.net/championhengyi/article/details/7666 ...

  7. Time complexity--codility

    lesson 3: Time complexity exercise: Problem: You are given an integer n. Count the total of 1+2+...+ ...

  8. C/C++中一些不太注意到的小知识点--[锦集]

    C/C++中一些不太注意到的小知识点--[锦集] C/C++小知识点--[锦集] "="和"<=" 的优先级 1.( (file_got_len = re ...

  9. proxool 连接池

    今天配置proxool 连接池,发现可配置属性非常多,以前也只是用,没总结过,今天查了下网上的资料,总结一下 方便你我.其实网上很多英文资料都很全,网上很多人就是考翻译老外的文章赚些流量,其实也没啥意 ...

  10. linux 时钟时间，用户CPU时间，系统CPU时间 .

    之前看过几次这几个的概念,但还是老是记不住,干脆就直接写下来,以后方便看~ 所谓的时钟时间又叫做墙上时钟时间,它是进程运行的时钟总量,其值与系统中同时运行的进程数有关,不过一般在讨论时钟时间的时候都是 ...