本书以零基础讲解为宗旨，用实例引导读者深入学习，采取JavaScript基础知识→JavaScript核心技术→JavaScript高级应用→网页特效应用案例的讲解模式，深入浅出地讲解了JavaScript动态网页设计和开发动态网站的各项技术及实战技能。
　　本书适合任何想学习JavaScript动态网页设计的人员，无论您是否从事计算机相关行业，无论您是否接触过JavaScript动态网页设计，通过学习本书内容均可快速掌握JavaScript动态网页设计和开发动态网站的方法和技巧。

　　清华大学出版社“案例课堂”大系
　　丛书以案例的形式讲解软件的内容，读者可以在实践中熟练掌握软件的使用方法。
　　每一个案例都精挑细选，同时配有全程语音讲解的视频文件，方便读者学习。
　　案例的选材广泛，涉及到软件应用的各个领域、各个行业，学习无死角。
　　“CG设计”系列全彩精印，同等价位下内容更多，同等内容下更实惠。
　　“网站开发”系列附赠超值，全面学习无障碍：
　　CSS属性速查表
　　HTML标签速查表
　　网页布局案例赏析
　　精彩网站配色方案赏析
　　精选JavaScript实例
　　JavaScript函数速查手册
　　CSS+DIV布局案例赏析
　　案例源文件与教学课件

　　"网站开发案例课堂"系列图书是专门为网站开发和数据库初学者量身定做的一套学习用书，由IT应用实训中心的高级讲师编著，整套书涵盖网站开发、数据库设计等方面。整套书具有以下特点。
　　前沿科技
　　无论是网站建设、数据库设计还是HTML5、CSS3，精选的是较为前沿或者用户群最多的领域，帮助大家认识和了解最新动态。
　　权威的作者团队
　　组织国家重点实验室和资深应用专家联手编著该套图书，融合了丰富的教学经验与优秀的管理理念。
　　学习型案例设计
　　以技术的实际应用过程为主线，全程采用图解和多媒体同步结合的教学方式，生动、直观、全面地剖析使用过程中的各种应用技能，降低难度，提升学习效率。
　　为什么要写这样一本书
　　随着网络的发展，很多企事业单位和广大网民对于建立网站的需求越来越强烈，另外对于大中专院校，很多学生需要做毕业设计，但是这些读者既不懂网页代码程序，又不知道从哪里下手。为此，本书针对这样的零基础读者，全面带领读者学习JavaScript的相关知识，读者在学习JavaScript中遇到的技术，本书基本上都有详细讲解。通过本书的实训，读者可以很快地进行JavaScript动态网页的设计，提高职业化能力，从而解决公司实际需求问题。
　　本书特色
　　零基础、入门级的讲解
　　无论您是否从事计算机相关行业，无论您是否接触过JavaScript动态网页设计和动态网站开发，都能从本书中找到最佳起点。
　　实用、专业的范例和项目
　　本书在编排上紧密结合深入学习JavaScript动态网页设计和开发动态网站技术的过程，从JavaScript基本操作开始，逐步带领读者学习JavaScript的各种应用技巧，侧重实战技能，使用简单易懂的实际案例进行分析和操作指导，让读者学起来简明轻松，操作起来有章可循。
　　随时检测自己的学习成果
　　每章首页中均提供了学习目标，可指导读者重点学习及学后检查。
　　每章最后的"跟我练练手"板块均根据该章内容精选而成，读者可以随时检测自己的学习成果和实战能力，做到融会贯通。
　　细致入微、贴心提示
　　本书在讲解过程中，在各章中使用了"注意"、"提示"、"技巧"等小栏目，使读者在学习过程中能更清楚地了解相关操作、理解相关概念，并轻松掌握各种操作技巧。
　　专业创作团队和技术支持
　　本书由IT应用实训中心编著和提供技术支持。
　　您在学习过程中遇到任何问题，可加入智慧学习乐园QQ群：221376441进行提问，随时有资深实战型讲师答疑。
　　本书学习最佳途径
　　本书以学习JavaScript动态网页开发的最佳制作流程来分配章节，从最初的JavaScript基本操作开始，讲解了JavaScript核心技术、JavaScript的高级应用等，最后结合HTML、CSS的相关知识讲解各种经典的动态网页特效的制作方法。大致内容分配如下图所示。
　　超值光盘
　　全程同步录像教学
　　本书所配光盘内容涵盖了书中所有的知识点，详细讲解了每个实例的制作过程和技术点，比看书更轻松、收获更多。
　　王牌资源大放送
　　赠送大量王牌资源，包括本书实例源文件、教学幻灯片、本书精品教学视频、JavaScript函数速查手册、精选的JavaScript实例、jQuery选择器和事件速查手册、HTML标签速查表、网页样式与布局案例赏析、精彩网站配色方案赏析、CSS+DIV布局赏析案例。
　　读者对象
　　* 没有任何JavaScript动态网页开发基础的初学者。
　　* 有一定的JavaScript动态网页开发和基础，想精通网站开发的人员。
　　* 有一定的动态网站开发基础，没有项目经验的人员。
　　* 正在进行毕业设计的学生。
　　* 大专院校及培训学校的老师和学生。
　　创作团队
　　本书由刘玉红策划，IT应用实训中心高级组织编写，参加编写的人员有蒲娟、付红、李园、王攀登、郭广新、侯永岗、刘海松、孙若淞、王月娇、包慧利、陈伟光、胡同夫、梁云梁和周浩浩。
　　在编写过程中，我们虽竭尽所能将最好的讲解呈现给了读者，但难免有疏漏和不妥之处，敬请读者不吝指正。
　　编 者

作者长期从事网站开发工作，数年来承接了大量的项目，具有丰富的实践经验。

第1篇 基础知识
第1章 打开JavaScript动态网页设计之门--必须了解的JavaScript知识 3
1.1 认识JavaScript 4
1.1.1 什么是JavaScript 4
1.1.2 JavaScript的特点 4
1.1.3 JavaScript与Java的区别 5
1.1.4 JavaScript版本 6
1.2 JavaScript的编写工具 7
1.2.1 案例--使用记事本
编写JavaScript 7
1.2.2 案例--使用Dreamweaver
编写JavaScript 8
1.3 JavaScript在HTML中的使用 9
1.3.1 案例--在HTML网页头中
嵌入JavaScript代码 9
1.3.2 案例--在HTML网页中
嵌入JavaScript代码 10
1.3.3 案例--在HTML网页的元素
事件中嵌入JavaScript代码 11
1.3.4 案例--在HTML中调用已经
存在的JavaScript文件 12
1.3.5 案例--通过JavaScript伪URL
引入JavaScript脚本代码 13
1.4 JavaScript和浏览器 14
1.4.1 案例--在Internet Explorer中
调用JavaScript代码 14
1.4.2 案例--在Firefox中调用
JavaScript代码 15
1.4.3 案例--在Opera中调用
JavaScript代码 15
1.4.4 案例--浏览器中的文档对象
类型 15
1.5 跟我练练手 16
1.6 实战演练--一个简单的JavaScript
实例 16
1.7 高手甜点 17
第2章 读懂JavaScript代码前提--
JavaScript 编程基础 19
2.1 JavaScript的基本语法 20
2.1.1 语句执行顺序 20
2.1.2 区分大小写 20
2.1.3 分号与空格 20
2.1.4 对代码行进行折行 21
2.1.5 注释 21
2.1.6 语句 23
2.1.7 语句块 23
2.2 JavaScript的数据结构 24
2.2.1 标识符 24
2.2.2 关键字 25
2.2.3 保留字 25
2.2.4 常量 26
2.2.5 变量 26
2.3 JavaScript的数据类型 28
2.3.1 案例--typeof 运算符 28
2.3.2 案例--Undefined(未定义)
类型 29
2.3.3 案例--Null(空值)类型 30
2.3.4 案例--Boolean(布尔)类型 31
2.3.5 案例--Number(数值)类型 32
2.3.6 案例--String(字符串数据)
类型 32
2.3.7 案例--Object(对象数据)
类型 33
2.4 JavaScript的运算符 34
2.4.1 案例--算术运算符 34
2.4.2 案例--比较运算符 35
2.4.3 案例--位运算符 36
2.4.4 案例--逻辑运算符 37
2.4.5 案例--条件运算符 39
2.4.6 案例--赋值运算符 40
2.4.7 案例--运算符优先级 41
2.5 JavaScript的表达式 43
2.5.1 案例--赋值表达式 43
2.5.2 案例--算术表达式 44
2.5.3 案例--布尔表达式 44
2.5.4 案例--字符串表达式 45
2.5.5 案例--类型转换 46
2.6 实战演练--局部变量和全局变量的
优先级 47
2.7 跟我练练手 49
2.8 高手甜点 49
第3章 改变程序执行方向--程序控制
结构与语句 51
3.1 基本处理流程 52
3.2 赋值语句 52
3.3 条件判断语句 53
3.3.1 案例--if语句 53
3.3.2 案例--"if...else"语句 54
3.3.3 案例--"if...else if"语句 55
3.3.4 案例--if语句的嵌套 56
3.3.5 案例--switch语句 57
3.4 循环控制语句 59
3.4.1 案例--while语句 59
3.4.2 案例--"do...while"语句 60
3.4.3 案例--for循环语句 61
3.5 跳转语句 62
3.5.1 案例--break语句 62
3.5.2 案例--continue语句 63
3.6 案例--使用对话框 64
3.7 实战演练--在页面中显示距离
2016年元旦节的天数 66
3.8 跟我练练手 68
3.9 高手甜点 68
第4章 JavaScript语言代码中的
密码--函数 69
4.1 函数的简介 70
4.2 定义函数 70
4.2.1 不指定函数名 70
4.2.2 指定函数名 71
4.2.3 函数参数的使用 71
4.2.4 案例--函数返回值 72
4.3 函数的调用 74
4.3.1 案例--函数的简单调用 74
4.3.2 案例--在表达式中
调用函数 75
4.3.3 案例--在事件响应中
调用函数 75
4.3.4 案例--通过链接调用函数 76
4.4 JavaScript中常用的函数 77
4.4.1 案例--嵌套函数 77
4.4.2 案例--递归函数 78
4.4.3 案例--内置函数 80
4.5 实战演练--购物简易计算器 87
4.6 跟我练练手 89
4.7 高手甜点 90
第5章 JavaScript 语言基础--对象
与数组 91
5.1 了解对象 92
5.1.1 什么是对象 92
5.1.2 面向对象编程 93
5.1.3 JavaScript的内部对象 94
5.2 对象访问语句 95
5.2.1 案例--"for...in"
循环语句 95
5.2.2 案例--with语句 96
5.3 JavaScript中的数组 97
5.3.1 案例--创建和访问数组
对象 97
5.3.2 案例--使用"for...in"语句
控制数组 99
5.3.3 案例--Array对象的常用
属性和方法 100
5.4 详解常用的数组对象方法 110
5.4.1 案例--连接其他数组到
当前数组 110
5.4.2 案例--将数组元素连接为
字符串 111
5.4.3 案例--移除数组中最后一个
元素 111
5.4.4 案例--将指定的数值添加到
数组中 112
5.4.5 案例--反序排列数组中的
元素 113
5.4.6 案例--删除数组中的第一个
元素 114
5.4.7 案例--获取数组中的一部分
数据 115
5.4.8 案例--对数组中的元素进行
排序 115
5.4.9 案例--将数组转换成
字符串 117
5.4.10 案例--将数组转换成本地
字符串 117
5.4.11 案例--在数组开头插入
数据 118
5.5 创建和使用自定义对象 119
5.5.1 案例--定义对象的
构造函数 119
5.5.2 案例--直接对对象初始化 121
5.5.3 案例--修改和删除对象
实例的属性 122
5.5.4 案例--通过原型为对象添加
新属性和新方法 123
5.5.5 案例--自定义对象的嵌套 125
5.5.6 案例--内存的分配和释放 127
5.6 实战演练--利用二维数组创建
动态下拉菜单 127
5.7 跟我练练手 129
5.8 高手甜点 129
第6章 JavaScript的内置对象--
日期与字符串对象 131
6.1 日期对象 132
6.1.1 案例--创建日期对象 132
6.1.2 案例--日期对象的方法 133
6.2 详解日期对象的常用方法 136
6.2.1 案例--返回当前日期和
时间 136
6.2.2 案例--以不同的格式显示
当前日期 137
6.2.3 案例--返回日期所对应的
周次 138
6.2.4 案例--显示当前时间 139
6.2.5 案例--返回距1970年1月1日
午夜的时差 140
6.2.6 案例--以不同的格式显示
UTC日期 140
6.2.7 案例--根据世界时返回日期
对应的周次 141
6.2.8 案例--以不同的格式显示
UTC时间 142
6.2.9 案例--设置日期对象中的
年份、月份与日期值 143
6.2.10 案例--设置小时、分钟与
秒钟的值 144
6.2.11 案例--设置Date对象的
UTC日期 145
6.2.12 案例--返回当地时间与
UTC时间的差值 146
6.2.13 案例--将Date对象中的日期
转化为字符串格式 147
6.2.14 案例--返回以UTC时间
表示的日期字符串 147
6.2.15 案例--将日期对象转化为
本地日期 148
6.2.16 案例--日期间的运算 148
6.3 字符串对象 149
6.3.1 创建字符串对象的方法 149
6.3.2 字符串对象的常用属性 150
6.3.3 字符串对象的常用方法 151
6.4 详解字符串对象的常用方法 152
6.4.1 案例--设置字符串字体
属性 152
6.4.2 案例--以闪烁方式显示
字符串 153
6.4.3 案例--转换字符串的
大小写 154
6.4.4 案例--连接字符串 155
6.4.5 案例--比较两个字符串的
大小 155
6.4.6 案例--分割字符串 156
6.4.7 案例--从字符串中提取
字符串 157
6.5 实战演练--制作网页随机验证码 158
6.6 跟我练练手 159
6.7 高手甜点 160
第7章 JavaScript的内置对象--
数值与数学对象 161
7.1 Number对象 162
7.1.1 案例--创建Number对象 162
7.1.2 案例--Number对象的属性 162
7.1.3 Number对象的方法 166
7.2 详解Number对象常用的方法 166
7.2.1 案例--把Number对象
转换为字符串 166
7.2.2 案例--把Number对象
转换为本地格式字符串 167
7.2.3 案例--四舍五入时指定
小数位数 167
7.2.4 案例--返回以指数记数法
表示的数字 168
7.2.5 案例--以指数记数法指定
小数位 169
7.3 Math对象 169
7.3.1 案例--创建Math对象 169
7.3.2 案例--Math对象的属性 170
7.3.3 Math对象的方法 171
7.4 详解Math对象常用的方法 172
7.4.1 案例--返回数的绝对值 172
7.4.2 案例--返回数的正弦值、
正切值和余弦值 173
7.4.3 案例--返回数的反正弦值、
正切值和余弦值 175
7.4.4 案例--返回两个或多个
参数中的最大值或最小值 177
7.4.5 案例--计算指定数值的
平方根 178
7.4.6 案例--数值的幂运算 178
7.4.7 案例--计算指定数值的
对数 179
7.4.8 案例--取整运算 180
7.4.9 案例--生成0到1之间的
随机数 180
7.4.10 案例--根据指定的坐标
返回一个弧度值 181
7.4.11 案例--返回大于或等于
指定参数的最小整数 182
7.4.12 案例--返回小于或等于
指定参数的最大整数 182
7.4.13 案例--返回以e为
基数的幂 183
7.5 实战演练--使用Math对象
设计程序 184
7.6 跟我练练手 185
7.7 高手甜点 185
第8章 编程错误的终结者--
JavaScript的调试与优化 187
8.1 常见的错误和异常 188
8.2 处理异常的方法 189
8.2.1 案例--用onerror事件
处理异常 189
8.2.2 案例--使用
"try...catch...finally"
语句处理异常 191

　　第3章 改变程序执行方向--程序控制结构与语句
　　药店
　　JavaScript编程中对程序流程的控制主要通过条件判断、循环控制语句及continue、break来完成。其中，条件判断按预先设定的条件执行程序，包括if语句和switch语句；而循环控制语句则可以重复完成任务，包括while语句、"do...while"语句及for语句。本章将主要讲述JavaScript的程序控制结构与相关的语句。
　　本章要点(已掌握的在方框中打勾)
　　* 熟悉赋值语句的使用方法。
　　* 掌握条件判断语句的使用方法。
　　* 掌握循环控制语句的使用方法。
　　* 掌握跳转语句的使用方法。
　　3.1 基本处理流程
　　对数据结构的处理流程，称为基本处理流程。在JavaScript中，基本处理流程包含3种结构，即顺序结构、选择结构和循环结构。
　　顺序结构是JavaScript脚本程序中最基本的结构，它按照语句出现的先后顺序依次执行，如图3-1所示。
　　选择结构按照给定的逻辑条件来决定执行顺序，有单向选择、双向选择和多向选择之分，但程序在执行过程中都只执行其中一条分支。单向选择和双向选择结构如图3-2所示。
　　图3-1 顺序结构 图3-2 单向选择和双向选择结构
　　循环结构即根据代码的逻辑条件来判断是否重复执行某一段程序，若逻辑条件为true，则进入循环重复执行，否则结束循环。循环结构可分为条件循环和计数循环，如图3-3所示。
　　图3-3 循环结构
　　一般而言，在JavaScript脚本语言中，程序总体是按照顺序结构执行的，而在顺序结构中又可以嵌入选择结构和循环结构。
　　3.2 赋 值 语 句
　　赋值语句是JavaScript程序中最常用的语句。在程序中，往往需要大量的变量来存储程序中用到的数据，所以用来对变量进行赋值的赋值语句也会在程序中大量出现。赋值语句的语法格式如下：
　　变可量名=表达式
　　当使用关键字var声明变量时，可以同时使用赋值语句对声明的变量进行赋值。例如，声明一些变量，并分别给这些变量赋值，代码如下：
　　var username="Rose"
　　var bue=true
　　var variable="开怀大笑，益寿延年"
　　3.3 条件判断语句
　　条件判断语句是对语句中不同条件的值进行判断，进而根据不同的条件执行不同的语句。条件判断语句主要包括两大类，分别是if判断语句和switch多分支语句。
　　3.3.1 案例--if语句
　　if语句是使用最为普遍的条件选择语句。每一种编程语言都有一种或多种形式的if语句，在编程中它经常被用到。
　　If语句的格式如下：
　　if(条件语句)
　　{
　　执行语句;
　　}
　　其中，"条件语句"可以是任何一种逻辑表达式。如果"条件语句"的返回结果为true，则程序先执行后面大括号{}中的"执行语句"，然后执行它后面的其他语句。如果"条件语句"的返回结果为false，则程序跳过"条件语句"后面的"执行语句"，直接去执行程序后面的其他语句。大括号的作用就是将多条语句组合成一个复合语句，作为一个整体来处理。如果大括号中只有一条语句，那么这对大括号{}就可以省略。
　　【例3.1】(实例文件：ch03\3.1.html)if语句的使用。
　　如果时间早于20:00，会获得问候"Good day"。
　　上述代码在IE 9.0浏览器中的显示效果如图3-4所示。单击页面中的【点击这里】按钮，可以看到按钮下方显示出"Good day"问候语，如图3-5所示。
　　图3-4 程序运行结果 图3-5 程序运行结果
　　请使用小写的if，如果使用大写字母(IF)则会生成JavaScript错误。另外，在这个语法中，没有else，因此，用户已经告诉浏览器只有在指定条件为true时才执行代码。
　　3.3.2 案例--"if...else"语句
　　"if...else"语句通常用于一个条件需要两个程序分支来执行的情况。"if...else"语句语法格式如下所示。
　　if (条件)
　　{
　　当条件为true时执行的代码
　　}
　　else
　　{
　　当条件不为true时执行的代码
　　}
　　如果在该格式if从句后面再添加一个else从句，当条件语句返回结果为false时，那么程序将执行else后面的从句。
　　【例3.2】 (实例文件：ch03\3.2.html)"if...else"语句的使用。
　　上述代码中使用了"if...else"语句，对变量a的值进行判断，如果a值不等于"john"则输出红色标题，否则输出蓝色信息。
　　上述代码在IE 9.0浏览器中的显示效果如图3-6所示，可以看到网页输出了蓝色信息"请重新输入名称"。
　　图3-6 "if...else"语句判断
　　3.3.3 案例--"if...else if"语句
　　使用"if...else if"语句来选择多个代码块之一来执行。"if...else if"语句的语法格式如下：
　　if (条件1)
　　{
　　当条件1为true时执行的代码
　　}
　　else if (条件2)
　　{
　　当条件2为true时执行的代码
　　}
　　else
　　{
　　当条件1和条件2都不为true时执行的代码
　　}
　　【例3.3】 (实例文件：ch03\3.3.html)使用"if...else if"语句输出问候语。
　　if...else if语句的使用
　　上述代码在IE 9.0浏览器中的显示效果如图3-7所示。
　　图3-7 "if...else if"语句判断结果
　　3.3.4 案例--if语句的嵌套
　　if语句可以嵌套使用。当if语句的从句部分(大括号中的部分)是另外一个完整的if语句时，外层if语句的{}部分的从句内容可以省略。但是，在使用if语句的嵌套应用时，最好使用{}来确定层次关系。否则，由于使用{}的位置不同，可能会导致程序代码的含义不同，从而输出不同的结果。例如下面的两个实例，由于{}位置的不同，导致输出结果不同。
　　【例3.4】 (实例文件：ch03\3.4.html)if语句的嵌套。
　　上述代码在IE 9.0浏览器中的显示效果如图3-8所示。
　　图3-8 程序运行结果
　　【例3.5】 (实例文件：ch03\3.5.html)调整嵌套语句中{}的位置。
　　运行该程序，则不会出现任何结果，如图3-9所示。可以看出，由于使用{}的位置不同，造成程序代码的含义完全不同。因此，在嵌套使用时，最好使用{}对程序代码的层次关系进行界定。
　　图3-9 程序运行结果
　　3.3.5 案例--switch语句
　　switch选择语句用于将一个表达式的结果同多个值进行比较，并根据比较结果选择执行语句。switch语句的语法格式如下：
　　switch (表达式)
　　{
　　case 取值1 :
　　语句块1;break;
　　case 取值2 :
　　语句块2;break；
　　...
　　case 取值n;
　　语句块n;break;
　　default :
　　语句块n+1;
　　}
　　case语句只是相当于定义一个标记位置，程序根据switch条件表达式的结果，直接跳转到第一个匹配的标记位置处，开始顺序执行后面的所有程序代码，包括后面的其他case语句下的代码，直到碰到break语句或函数返回语句为止。default语句是可选的，它匹配上面所有case语句定义的值以外的其他值，也就是前面所有取值都不满足时，就执行default后面的语句块。
　　【例3.6】 (实例文件：ch03\3.6.html)应用switch语句判断当前是星期几。
　　……