JavaScript基础教程（第9版）

Dori Smith，世界知名的Web程序员和设计师，从事软件开发已有20多年。她是Web标准项目（WaSP）指导委员会委员，并发起成立了世界性的女性技术社区Wise-Women Web。

Tom Negrino，蜚声全球的技术作家，长期主持Macworld和许多其他技术杂志的专栏。自1995年开始，与Dori Smith合作著书，向初学者介绍Web，目前已著有数十本书。

第1章了解JavaScript1

1.1JavaScript是什么1

1.2JavaScript不是Java2

1.3JavaScript的起源3

1.4JavaScript可以做什么3

1.5JavaScript不能做什么4

1.6JavaScript及其他4

1.6.1jQuery是什么4

1.6.2Ajax是什么4

1.7组合式语言6

1.7.1对象6

1.7.2属性6

1.7.3方法7

1.7.4将对象、属性和方法组合在一起7

1.7.5DOM简介7

1.8处理事件8

1.9值和变量8

1.9.1操作符9

1.9.2赋值和比较9

1.9.3比较10

1.10编写对JavaScript友好的HTML10

1.10.1结构、表现和行为11

1.10.2div和span11

1.10.3class和id11

1.11要使用什么工具12

第2章开始14

2.1将脚本放在哪里14

2.2关于函数15

2.3使用外部脚本16

2.4在脚本中添加注释17

2.5向用户发出警告18

2.6确认用户的选择20

2.7提示用户21

2.8用链接对用户进行重定向23

2.9使用JavaScript改进链接25

2.10使用多级条件28

2.11处理错误31

第3章第一个Web应用程序33

3.1用循环进行重复操作33

3.2将值传递给函数38

3.3探测对象39

3.4处理数组41

3.5处理有返回值的函数42

3.6更新数组43

3.7使用do/while循环45

3.8以多种方式调用脚本46

3.9组合使用JavaScript和CSS48

3.10检查状态51

3.11处理字符串数组56

第4章处理图像60

4.1创建翻转器60

4.2创建更有效的翻转器62

4.3构建三状态翻转器66

4.4由链接触发翻转器67

4.5让多个链接触发一个翻转器69

4.6处理多个翻转器72

4.7创建循环的广告条75

4.8在循环广告条中添加链接77

4.9建立循环式幻灯片79

4.10显示随机图像81

4.11随机开始循环显示图像82

第5章窗口与框架84

5.1防止页面显示在框架中84

5.2设置目标85

5.3用JavaScript加载iframe87

5.4iframe的使用88

5.5创建动态iframe90

5.6在文档之间共享函数91

5.7打开新窗口93

5.8为窗口加载不同的内容96

第6章表单处理98

6.1选择并转移导航菜单99

6.2动态地改变菜单102

6.3建立必须填写的字段104

6.4根据其他字段对字段进行检查108

6.5标识有问题的字段110

6.6准备进行表单验证112

6.7处理单选按钮116

6.8用一个字段设置另一个字段119

6.9检验Zip编码121

6.10验证电子邮件地址125

第7章 表单和正则表达式130

7.1用正则表达式验证电子邮件地址130

7.2验证文件名135

7.3提取字符串137

7.4格式化字符串139

7.5对字符串进行格式化和排序142

7.6对字符串进行格式化和验证143

7.7使用正则表达式替换元素146

第8章处理事件148

8.1处理窗口事件148

8.1.1onload事件148

8.1.2onunload事件151

8.1.3onbeforeunload事件151

8.1.4onresize事件153

8.1.5onmove事件153

8.1.6onabort事件153

8.1.7onerror事件153

8.1.8onfocus事件和onblur事件153

8.1.9onscroll事件153

8.1.10onDOMContentLoaded事件153

8.2处理鼠标事件153

8.2.1onmousedown事件154

8.2.2onmouseup事件156

8.2.3onmousemove事件156

8.2.4onmouseover事件159

8.2.5onmouseout事件159

8.2.6ondblclick事件159

8.2.7onclick事件160

8.3表单事件处理160

8.3.1onsubmit事件160

8.3.2onreset事件161

8.3.3onchange事件161

8.3.4onselect事件161

8.3.5onclick事件161

8.3.6onblur事件161

8.3.7onfocus事件163

8.4键事件处理164

8.4.1onkeydown事件164

8.4.2onkeyup事件167

8.4.3onkeypress事件167

8.5高级事件处理167

8.5.1addEventListener方法167

8.5.2removeEventListener方法169

8.5.3dispatchEvent方法169

8.5.4initEvent方法169

8.5.5stopPropagation方法169

8.5.6preventDefault方法169

第9章JavaScript和cookie171

9.1建立第一个cookie171

9.2读取cookie174

9.3显示cookie175

9.4使用cookie作为计数器176

9.5删除cookie178

9.6处理多个cookie180

9.7显示新内容提醒信息182

第10章对象和DOM186

10.1关于节点操纵186

10.1.1DOM 2和W3C186

10.1.2DOM 2术语186

10.1.3DOM 3187

10.2添加节点187

10.3删除节点189

10.4删除特定的节点191

10.5插入节点194

10.6替换节点196

10.7用对象字面量编写代码199

第11章建立动态页面204

11.1在网页上显示当前日期204

11.2处理周中的日期206

11.3根据时间对消息进行定制207

11.4根据时区显示日期208

11.5把24小时制转换为12小时制211

11.6创建倒数计数器214

11.7隐藏和显示层217

11.8移动文档中的对象220

11.9日期方法221

第12章JavaScript应用示例223

12.1使用可折叠菜单223

12.2添加下拉菜单226

12.3改进下拉菜单229

12.4带说明的幻灯片232

12.5一个娱乐姓名生成器235

12.6柱状图生成器239

12.7样式表切换器246

第13章Ajax简介254

13.1Ajax的定义254

13.2读取服务器数据256

13.3解析服务器数据263

13.4刷新服务器数据268

13.5从服务器获得数据270

13.6用Ajax预览链接273

13.7自动补全表单字段276

13.8检查文件是否存在281

第14章工具包、框架和库285

14.1添加jQuery286

14.2使用jQuery更新页面288

14.3使用jQuery交互288

14.4交互与更新291

14.5条纹表格292

14.6表格排序296

第15章用jQuery设计页面301

15.1突出显示新元素301

15.2创建可折叠菜单303

15.3创建更漂亮的对话框306

15.4自动完成字段309

15.5添加可排序选项卡311

15.6使用复选框作为按钮313

15.7在页面中添加日历316

15.8使用ThemeRoller定制外观320

第16章基于jQuery的应用323

16.1以jQuery为基础323

16.1.1Ajax、JSON和jQuery323

16.1.2jQuery插件324

16.2拖放元素324

16.3使用jQuery处理外部数据327

16.4使用jQuery插件329

16.5添加jQuery音频插件333

第17章为移动设备编写脚本335

17.1改变方向335

17.2处理触摸事件342

17.3针对不同设备编写特定代码344

17.4定位设备346

第18章bookmarklet349

18.1第一个bookmarklet349

18.2改变页面的背景颜色353

18.3改变页面样式354

18.4查询单词355

18.5查看图像357

18.6显示ISO Latin字符359

18.7将RGB值转换为十六进制360

18.8对值进行转换362

18.9bookmarklet计算器362

18.10缩短URL364

18.11检验页面364

18.12通过电子邮件发送页面365

18.13改变页面大小366

附录AJavaScript的版本演化和参考资料368

附录BJavaScript保留字386

附录CCSS参考389

附录D其他学习资源398

欢迎使用JavaScript！使用这种容易上手的程序设计语言，可以给网页增色，使网页更好用。本书是一本轻松的JavaScript入门教程，所以即使不是计算机高手，你也可以由此很快学会脚本编写。任何时候你都不需要借助工具包。就像我们的一位朋友说的：“我们已经够疯狂了，所以你没有必要这样做啦！”

读者对象

我们猜想既然你有兴趣学习JavaScript，那么肯定有创建HTML页面和Web站点的经验，而且希望更进一步，使站点更具交互性。学习本书并不要求你了解任何编程或脚本编程的知识，也不要求你是HTML专家（当然，如果你是HTML专家也无妨）。我们只假设你具备构建网页的基本知识，而且熟悉常用的HTML标签，比如链接、图像和表单。同样，我们也希望你了解现代网页另一个主要构件块——CSS的基础知识。

在某些章题为“目前需要了解的HTML知识”的表中，我们对HTML做了一些解释。并非每章都有这部分内容，只有在我们认为你需要速查的地方才会提供。有了这些HTML信息，你就不需要在阅读本书的同时，再去翻另一本书或者打开相关网页查找HTML属性的语法了。

如果你对编程有所了解，应该会注意到本书介绍JavaScript的方式与其他图书的风格很不一样。本书并不深入介绍JavaScript的语法和结构，而且本书也不是一本深入而全面的语言参考书（当然附录A中提供了一些很有价值的内容）。这方面市面上已经有不少很好的书，附录D中列了出来。本书和这些书之间的差异是，本书并不拘泥于形式，而是集中地演示如何用JavaScript完成一些有用的任务，不赘述大量的额外信息。

在本书的前几版中，我们增加了对Ajax和jQuery的介绍。这种技术结合使用了JavaScript和其他常用的Web技术为网页增加交互性，并且改善了Web站点的用户体验。在这个版本中，我们添加了更多示例和技术介绍，使用流行的jQuery框架向网站轻松添加有用的功能。

如何使用本书

本书采用一些特殊的版式，帮助你更轻松地学习和理解JavaScript。

组成本书的大部分内容由分步说明构成。我们在书中以特殊的字体样式表示HTML或JavaScript代码，比如：

window.onload = initLinks；

你还会注意到，HTML和JavaScript代码都显示为小写。这么做是因为，这个版本中的所有脚本都符合W3C（World Wide Web Consortium，万维网联盟）的HTML5标准。当在JavaScript中看到引号时，总是直引号（'或"），而不是弯引号（‘或“）。弯引号会使JavaScript失效，在编写脚本时应该避免使用。

在与分步说明对应的脚本中，我们以粗体突出显示脚本中正在讨论的部分，这样你就能够马上找到我们正在讨论的代码。我们还常常在Web浏览器窗口的屏幕图中以灰色底纹突出显示其中某些重要的部分。

因为图书的页面比计算机屏幕窄，所以一些JavaScript代码行在页面上排不开。出现这种情况时，我们将代码行分为多行，在接续行前面使用箭头→表示这是续行，并且将续行缩进，如下所示：

dtString = "Hey， just what are you

？doing up so late？"；

关于浏览器

从第6版起有一个大的变化：我们不再支持那些版本非常老的浏览器或者那些在支持Web标准方面做得很差的浏览器。我们发现，几乎所有Web用户都升级到了现代浏览器，它们充分地支持公认的Web标准（比如HTML、CSS2和DOM）。这包括IE 9或更高版本，Firefox、Safari和Chrome的所有版本，以及Opera 7或更高版本。

我们在几种操作系统上的多个浏览器中测试了脚本，这些操作系统包括Windows（主要是Windows 7，有少数情况是Windows 8，不再支持Windows XP和Vista）、OS X（10.8.5或更高版本）和Ubuntu Linux（只在Ubuntu的默认浏览器Firefox中测试了脚本）。

我们使用最主流的浏览器——微软Windows版本的IE——虚拟测试了本书中的所有内容（使用了IE 9、IE 10和IE 11）。这一版，我们还增加了针对Mac和Windows平台上持续更新的谷歌Chrome的测试。我们还用Mac和Windows平台上最新版本的Firefox（每几周就更新一次，本书使用的最新版本为29）对脚本进行了测试。此外，还使用Mac平台上的Safari 6和7进行了测试。这意味着这些脚本对于从WebKit引擎衍生出来的任何浏览器都可以正常使用，对基于KHTML（Safari最开始使用的开源呈现引擎）的浏览器（比如Linux浏览器Konqueror）也可以正常使用。WebKit也是移动操作系统浏览器核心之一，比如苹果的iOS、谷歌的Android、亚马逊的Kindle Fire平板电脑，以及黑莓的Blackberry 10。对于移动设备，我们主要将脚本在iPhone和iPad上面进行了测试。

不必输入代码

一些JavaScript图书只在书中印刷出脚本代码，你在实践时必须自己输入代码。我们认为这种方式已经过时了。作者们不得不完成这些艰苦的输入工作，但是你不必重复这些劳动。我们为本书提供了一个配套Web站点，其中包含本书中的所有脚本，你可以将这些脚本复制并粘贴到自己的网页中。如果我们在书中发现了任何错误，也会在这里更正。这个配套站点的网址是www.javascriptworld.com。

如果由于某种原因你打算输入某些脚本示例，那么可能会发现这些示例似乎不起作用，这是因为你没有这些示例所用的支持文件。例如，在图像上实现屏幕效果的示例中，需要图像文件。但请放心，这些文件都放在本书的Web站点上了，而且打包好了供你下载。你找到的可下载文件包含所有脚本、HTML文件、CSS文件以及用到的所有媒体文件。如果你遇到任何问题，可以查看配套Web站点上的FAQ（常见问题）。

如果阅读了FAQ，而你的问题还没有解决，可以通过js9@javascriptworld.com给我们发邮件。很抱歉地说一声，因为收到的邮件太多，所以我们不可能也不会回复那些把本书问题发送到我们个人邮箱的邮件。但是，我们可以保证发送到js9@javascriptworld.com的邮件会得到答复。

当然，自己输入代码可能会帮你更彻底地理解JavaScript，那么但做无妨！

开始吧

JavaScript最好的一点是它很容易用一个简单的脚本在网页上实现很酷的效果，然后根据需要逐渐添加更复杂的素材。你不必等到学完整本书，就可以开始改进自己的网页。等到你看完本书的时候，将能用Ajax和jQuery给站点添加高级的交互效果了。

当然，千里之行，始于足下。欢迎光临，请勿将手伸出窗外，照相时请不要用闪光灯。探索JavaScript的旅程已经开始。