标签的位置

按照传统的做法，所有<script>元素都应该放在页面的<head>元素中，例如：

 <!DOCTYPE html>

 <html>

 <head>

 <title>Example HTML Page</title>

 <script type="text/javascript" src="example1.js"></script>

 <script type="text/javascript" src="example2.js"></script>

 </head>

 <body>

 <!-- 这里放内容 -->

 </body>

 </html>

这种做法的目的就是把所有外部文件（包括 CSS 文件和 JavaScript 文件）的引用都放在相同的地方。
可是，在文档的<head>元素中包含所有 JavaScript 文件，意味着必须等到全部 JavaScript 代码都被下载、
解析和执行完成以后，才能开始呈现页面的内容（浏览器在遇到<body>标签时才开始呈现内容）。对于
那些需要很多 JavaScript 代码的页面来说，这无疑会导致浏览器在呈现页面时出现明显的延迟，而延迟
期间的浏览器窗口中将是一片空白。为了避免这个问题，现代 Web 应用程序一般都把全部 JavaScript 引
用放在<body>元素中页面内容的后面，如下例所示：

 <!DOCTYPE html>

 <html>

 <head>

 <title>Example HTML Page</title>

 </head>

 <body>

 <!-- 这里放内容 -->

 <script type="text/javascript" src="example1.js"></script>

 <script type="text/javascript" src="example2.js"></script>

 </body>

 </html>

这样，在解析包含的 JavaScript 代码之前，页面的内容将完全呈现在浏览器中。而用户也会因为浏
览器窗口显示空白页面的时间缩短而感到打开页面的速度加快了。

《JavaScript高级程序设计》 读书笔记（一）的更多相关文章

  1. 《html5 从入门到精通》读书笔记（一）

    今天看了<html5 从入门到精通>这本书,感觉阅读下来很舒心,不像阅读其他书籍很揪心.html增加的知识点,我觉得非常有价值,看完几章记录了一些内容,不但能巩固,也为下次遗忘知识点做好准 ...

  2. HTML5从入门到精通(明日科技) 中文pdf扫描版

    HTML5从入门到精通(明日科技) 中文pdf扫描版

  3. HTML5从入门到精通（千锋教育）免费电子版+PDF下载

    本书是HTML5初学者极好的入门教材之一,内容通俗易懂.由浅入深.循序渐进.本书内容覆盖全面.讲解详细,其中包括标签语义化.标签使用规范.选择器类型.盒模型.标签分类.样式重置.CSS优化.Photo ...

  4. Unity Shader入门精要读书笔记（一）序章

    本系列的博文是笔者读<Unity Shader入门精要>的读书笔记,这本书的章节框架是: 第一章:着手准备. 第二章:GPU流水线. 第三章:Shader基本语法. 第四章:Shader数 ...

  5. Oracle从入门到精通----学习笔记

    书名:<Oracle从入门到精通:视频实战版>秦靖.刘存勇等编著 第4章 SQL基础 1.SQL语言分类 数据定义语言 --- DDL,Data Definition Language 数 ...

  6. MySQL数据库应用 从入门到精通 学习笔记

    以下内容是学习<MySQL数据库应用 从入门到精通>过程中总结的一些内容提要,供以后自己复现使用. 一:数据库查看所有数据库: SHOW DATABASES创建数据库: CREATE DA ...

  7. Unity Shader入门精要读书笔记（二）UnityShader概述

    第三章<UnityShader概述>的读书笔记: 1.Unity Shader模板提供了几种选择: 标准光照模型(新添加的基于物理的渲染方法) 不含光照的基本的顶点.片元着色器 屏幕后处理 ...

  8. 《html5 从入门到精通》读书笔记（二）

    接着上面继续记录笔记,这次要记的知识点比较多...记录下我认为比较重要的东西. 一.表单属性 1.autocomplete属性 该属性规定form或input域应该拥有自动完成功能. <form ...

  9. 《html5 从入门到精通》读书笔记（三）

    二.标签详解 标签 描述 4 5 <form> 定义表单. 4 5 <h1> to <h6> 定义标题1到标题6. 4 5 <head> 定义关于文档的 ...

  10. 《HTML5 CANVAS基础教程》读书笔记

    一.HTML5简介 1.HTML5新特性 1)结构元素:section,header,hgroup,footer,nav,article,aside, 2)内容元素:figure,figcaption ...

随机推荐

  1. 搜索引擎spam

    什么是SPAM?搜索引擎优化中的SPAM 在搜索引擎优化相关的文章中中经常遇到“SPAM”一词,SPAM通常用来指垃圾邮件,不过在搜索引擎营销中所说的SPAM是专门针对那些欺骗搜索引擎的信息.搜索引擎 ...

  2. etc/ld.so.conf的使用说明

    这个文件记录了编译时使用的动态链接库的路径.默认情况下,编译器只会使用/lib和/usr/lib这两个目录下的库文件如果你安装了某些库,比如在安装gtk+-2.4.13时它会需要glib-2.0 &g ...

  3. Android 签名(8)签名前用Zipalign简单优化

    1 为什么要优化 Android SDK中包含一个“zipalign”的工具,它能够对打包的应用程序进行优化.在你的应用程序上运行zipalign,使得在运行时Android与应用程序间的交互更加有效 ...

  4. 【HDOJ】4305 Lightning

    1. 题目描述当一个结点lightning后,可以向其周围距离小于等于R的结点传播lightning.然后以该结点为中心继续传播.以此类推,问最终形成的树形结构有多少个. 2. 基本思路生成树级数模板 ...

  5. git stash

      https://git-scm.com/docs/git-stash   NAME git-stash - Stash the changes in a dirty working directo ...

  6. js模仿jquery里的几个方法next, pre, nextAll, preAll

    /*siblings函数, 选取node的所有兄弟节点*/ function siblings(node){ if(node.nodeType === 1){ node.flag = true; // ...

  7. 宏FSP_SEG_INODES_PER_PAGE

    #define FSP_SEG_INODES_PER_PAGE(zip_size) \ (((zip_size ? zip_size : UNIV_PAGE_SIZE) \ - FSEG_ARR_OF ...

  8. 存储过程 分页【NOT IN】和【>】效率大PK 千万级别数据测试结果

    use TTgoif exists (select * from sysobjects where name='Tonge')drop table Tongecreate table Tonge( I ...

  9. 为自己打造Linux小系统

     一.前言 Linux操作系统至1991.10.5号诞生以来,就源其开源性和自由性得到了很多技术大牛的青睐,每个Linux爱好者都为其贡献了自己的一份力,不管是在Linux内核还是开源软件等方面,都为 ...

  10. show slave status中的log_file / log_pos

    在MySQL的master-slave或dual master的架构中,我们经常使用show slave status命令来查看复制状态. 这里涉及几个重要的日志文件和位置: Master_Log_F ...