标签的位置

按照传统的做法，所有<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. 一步一步制作yaffs/yaffs2根文件系统(三)---使用glibc库构造 /lib

    开发环境:Ubuntu 12.04 开发板:mini2440  256M NandFlash   64M SDRAM glibc库:点此下载 交叉编译器:arm-linux-gcc 4.4.3点此可下 ...

  2. 无效的 URI: 未能分析证书颁发机构/主机

    出 现该错误的原因是URL中少了一个斜杠,正常的URL是“http:”后边有两个斜杠,而我在修改配置文件中的URL的IP地址部分时,不小心删掉了一个 斜杠,例如:http:/blog.csdn.net ...

  3. Use powerful plugins in your vim.

    # setup by root wget http://prdownloads.sourceforge.net/ctags/ctags-5.8.tar.gz tar -xzvf ctags-5.8.t ...

  4. C#.Net 如何动态加载与卸载程序集（.dll或者.exe）6-----在不卸载程序域的前提下替换程序集文件。

    当某个程序集文件被载入AppDomain,该文件在AppDomain.Unload之前是不能被替换和删除的.使用AppDomainSetup的影像复制功能可以实现在不卸载程序的情况下替换或者删除程序集 ...

  5. 制作计算器的代码（C#)

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  6. LINUX Find命令使用

    LINUX Find命令使用 ====================================================== find   -name april*            ...

  7. everything搜索工具小技巧

    everything工具平时用的也不多,但是有时候使用的时候却总是找不着北. everything支持五种搜索方式,如下图: 正则匹配搜索: 当你选择正则匹配之后,你可能需要匹配某个文件夹里面的某个文 ...

  8. Welcome to Linux From Scratch!

    /**************************************************************************** * Welcome to Linux Fro ...

  9. Android学习系列(20)--App数据格式之解析Json

    JSON数据格式,在Android中被广泛运用于客户端和网络(或者说服务器)通信,非常有必要系统的了解学习.     恰逢本人最近对json做了一个简单的学习,特此总结一下,以飨各位.     为了文 ...

  10. Jmeter初步使用--Jmeter安装与使用

    由于jmeter是开源的性能测试工具,但是使用的人较少,网络上相关资料不全面,需要自己去揣摩,因此,小编就把自己在用Jmeter时的一些小结总结出来.而loadrunner工具是商业软件,网上通常都是 ...