标签的位置

按照传统的做法,所有<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. 关于JavaScript中的setTimeout()链式调用和setInterval()探索

    http://www.cnblogs.com/Wenwang/archive/2012/01/06/2314283.html http://www.cnblogs.com/yangjunhua/arc ...

  2. uva 993 Product of digits (贪心 + 分解因子)

      Product of digits  For a given non-negative integer number N , find the minimal natural Q such tha ...

  3. Complete The Pattern #1

    Complete The Pattern #1 Task: You have to write a function pattern which creates the following patte ...

  4. Android开发之通过Intent启动系统应用的协议

    使用隐式Intent启动系统应用,除了http协议,还有geo(显示地理位置),tel(拨打电话),file(文件)等

  5. foreach中引用 的问题

    在工作中遇到 关于 php foreach 引用的一个问题 简单来说,如下代码 $arr=array('a','b','c' ,'d'); foreach($arr as $k=>&$v ...

  6. 【转】Android.mk文件语法规范(Android.mk File)

    原文网址:http://blog.csdn.net/smfwuxiao/article/details/8530742 1.Android.mk文件概述 Android.mk文件用来告诉NDK编译系统 ...

  7. 新手!SDK Manager里找不到API安装的选项怎么办?

    只有Tools和EXTRAS文件夹的选项,没有API包安装,咋办呢?   回复讨论(解决方案) 网络有问题吗? 网络有问题吗? 就是不知道啊 你是在eclispe里面打开的?还是在外面直接打开的?没有 ...

  8. ZOJ 3469 Food Delivery 区间DP

    这道题我不会,看了网上的题解才会的,涨了姿势,现阶段还是感觉区间DP比较难,主要是太弱...QAQ 思路中其实有贪心的意思,n个住户加一个商店,分布在一维直线上,应该是从商店开始,先向两边距离近的送, ...

  9. mac中viso的兼容工具

    http://www.orsoon.com/Mac/77738.html破解教程 http://www.pc6.com/mac/111747.html下载地址 很强大,很爽.

  10. uva 11019 Matrix Matcher

    题意:给出一个n*m的字符矩阵T,你的任务是找出给定的x*y的字符矩阵P在T中出现了多少次. 思路:要想整个矩阵匹配,至少各行都得匹配.所以先把P的每行看做一个模式串构造出AC自动机,然后在T中的各行 ...