当前位置:在线查询网 > 在线百科全书查询 > JavaScript DOM经典编程艺术

JavaScript DOM经典编程艺术_在线百科全书查询


请输入要查询的词条内容:

JavaScript DOM经典编程艺术




基本信息


原书名:DOM Scripting: Web Design with JavaScript and the Document Object Model

原出版社: friendsofED

作者:(英)Jeremy Keith (加)Jeffrey Sambells

译者:杨涛王建桥杨晓云

丛书名: 图灵程序设计丛书

出版社:人民邮电出版社

ISBN:9787115249999

出版日期:2011 年4月

开本:16开

页码:286

版次:2-1

编辑推荐


Amazon超级畅销书最新版,释放JavaScript和DOM编程的惊人潜力,涵盖HTML5及jQuery

内容简介

《javascript dom编程艺术:第2版》讲述了javascript、dom 和html5 的基础知识,着重介绍dom 编程技术背后的思路和原则:平稳退化、渐进增强和以用户为中心等。这些概念对于任何前端web 开发工作都非常重要。本书将这些概念贯穿在书中的所有代码示例中,以便呈现用来创建图片库页面的脚本、用来创建动画效果的脚本和用来丰富页面元素呈现效果的脚本,最后结合所讲述的内容创建了一个实际的网站。

《javascript dom编程艺术:第2版》适合web 设计师和开发人员阅读。

作译者


Jeremy Keith 国际知名的Web设计师,Web标准项目组成员,DOM Scripting任务组负责人之一,任职于Web咨询公司Clearleft。除本书外,还著有HTML5 for Web Designers、Bulletproof Ajax。可通过其个人网站与他联系。

Jeffrey Sambells 资深平面设计师,Web开发人员,创办了软件公司We-Create并担任研发总监。除本书外,还著有《JavaScript高级程序设计》和 Beginning Google Maps Applications with PHP and Ajax等多部畅销书。

目录


《javascript dom编程艺术:第2版》

第1章 javascript简史 1

1.1 javascript的起源 1

1.2 dom 2

1.3 浏览器战争 3

1.3.1 dhtml 3

1.3.2 浏览器之间的冲突 3

1.4 制定标准 4

1.4.1 浏览器以外的考虑 4

1.4.2 浏览器战争的结局 5

1.4.3 崭新的起点 5

1.5 小结 6

第2章 javascript语法 8

2.1 准备工作 8

2.2 语法 10

2.2.1 语句 10

2.2.2 注释 10

2.2.3 变量 11

2.2.4 数据类型 14

2.2.5 数组 16

.2.2.6 对象 18

2.3 操作 19

2.4 条件语句 21

2.4.1 比较操作符 22

2.4.2 逻辑操作符 23

2.5 循环语句 24

2.5.1 while循环 24

2.5.2 for循环 25

2.6 函数 26

2.7 对象 29

2.7.1 内建对象 30

2.7.2 宿主对象 31

2.8 小结 31

第3章 dom 32

3.1 文档:dom中的“d” 32

3.2 对象:dom中的“o” 32

3.3 模型:dom中的“m” 33

3.4 节点 35

3.4.1 元素节点 35

3.4.2 文本节点 35

3.4.3 属性节点 36

3.4.4 css 36

3.4.5 获取元素 38

3.4.6 盘点知识点 42

3.5 获取和设置属性 43

3.5.1 getattribute 43

3.5.2 setattribute 44

3.6 小结 45

第4章 案例研究:javascript图片库 46

4.1 标记 46

4.2 javascript 48

4.2.1 非dom解决方案 49

4.2.2 最终的函数代码清单 50

4.3 应用这个javascript函数 50

4.4 对这个函数进行扩展 52

4.4.1 childnodes属性 53

4.4.2 nodetype属性 54

4.4.3 在标记里增加一段描述 54

4.4.4 用javascript改变这段描述 55

4.4.5 nodevalue属性 56

4.4.6 firstchild和lastchild属性 56

4.4.7 利用nodevalue属性刷新这段描述 57

4.5 小结 60

第5章 最佳实践 61

5.1 过去的错误 61

5.1.1 不要怪罪javascript 61

5.1.2 flash的遭遇 62

5.1.3 质疑一切 63

5.2 平稳退化 63

5.2.1 “javascript:”伪协议 64

5.2.2 内嵌的事件处理函数 65

5.2.3 谁关心这个 65

5.3 向css学习 66

5.3.1 结构与样式的分离 66

5.3.2 渐进增强 67

5.4 分离javascript 68

5.5 向后兼容 70

5.5.1 对象检测 70

5.5.2 浏览器嗅探技术 71

5.6 性能考虑 72

5.6.1 尽量少访问dom和尽量减少标记 72

5.6.2 合并和放置脚本 73

5.6.3 压缩脚本 73

5.7 小结 74

第6章 案例研究:图片库改进版 75

6.1 快速回顾 75

6.2 它支持平稳退化吗 76

6.3 它的javascript与html标记是分离的吗 77

6.3.1 添加事件处理函数 77

6.3.2 共享onload事件 82

6.4 不要做太多的假设 84

6.5 优化 86

6.6 键盘访问 88

6.7 把javascript与css结合起来 90

6.8 dom core和html-dom 93

6.9 小结 94

第7章 动态创建标记 96

7.1 一些传统方法 96

7.1.1 document.write 96

7.1.2 innerhtml属性 98

7.2 dom方法 101

7.2.1 createelement方法 101

7.2.2 appendchild方法 102

7.2.3 createtextnode方法 103

7.2.4 一个更复杂的组合 105

7.3 重回图片库 107

7.3.1 在已有元素前插入一个新元素 108

7.3.2 在现有方法后插入一个新元素 109

7.3.3 图片库二次改进版 111

7.4 ajax 114

7.4.1 xmlhttprequest对象 115

7.4.2 渐进增强与ajax 119

7.4.3 hijax 120

7.5 小结 121

第8章 充实文档的内容 122

8.1 不应该做什么 122

8.2 把“不可见”变成“可见” 123

8.3 内容 123

8.3.1 选用html、xhtml还是html5 124

8.3.2 css 126

8.3.3 javascript 127

8.4 显示“缩略语列表” 127

8.4.1 编写displayabbreviations函数 128

8.4.2 创建标记 130

8.4.3 一个浏览器“地雷” 135

8.5 显示“文献来源链接表” 138

8.6 显示“快捷键清单” 143

8.7 检索和添加信息 146

8.8 小结 147

第9章 css-dom 148

9.1 三位一体的网页 148

9.1.1 结构层 148

9.1.2 表示层 148

9.1.3 行为层 149

9.1.4 分离 150

9.2 style属性 150

9.2.1 获取样式 151

9.2.2 设置样式 156

9.3 何时该用dom脚本设置样式 158

9.3.1 根据元素在节点树里的位置来设置样式 158

9.3.2 根据某种条件反复设置某种样式 161

9.3.3 响应事件 165

9.4 classname属性 167

9.5 小结 171

第10章 用javascript实现动画效果 172

10.1 动画基础知识 172

10.1.1 位置 172

10.1.2 时间 175

10.1.3 时间递增量 175

10.1.4 抽象 178

10.2 实用的动画 184

10.2.1 提出问题 184

10.2.2 解决问题 186

10.2.3 css 187

10.2.4 javascript 189

10.2.5 变量作用域问题 192

10.2.6 改进动画效果 193

10.2.7 添加安全检查 196

10.2.8 生成html标记 198

10.3 小结 200

第11章 html5 201

11.1 html5简介 201

11.2 来自朋友的忠告 203

11.3 几个示例 204

11.3.1 canvas 205

11.3.2 音频和视频 209

11.3.3 表单 215

11.4 html5还有其他特性吗 219

11.5 小结 219

第12章 综合示例 220

12.1 项目简介 220

12.1.1 原始资料 220

12.1.2 站点结构 220

12.1.3 页面结构 221

12.2 设计 222

12.3 css 223

12.3.1 颜色 225

12.3.2 布局 226

12.3.3 版式 228

12.4 标记 229

12.5 javascript 230

12.5.1 页面突出显示 231

12.5.2 javascript幻灯片 235

12.5.3 内部导航 239

12.5.4 javascript图片库 242

12.5.5 增强表格 245

12.5.6 增强表单 249

12.5.7 压缩代码 263

12.6 小结 264

附录 javascript库 265

译者序


网上的生活越来越丰富多彩。从最初的(X)HTML网页,到一度热炒的DHTML概念,再到近几年流行起来的CSS,网站和网页的设计工作变得越来越简便,网上的内容越来越富于变化和色彩。但是,很多网页设计者和网民朋友都不太喜欢JavaScript,这主要有以下几方面原因。第一,很多网页设计者认为JavaScript的可用性很差——早期的浏览器彼此很少兼容,如果想让自己编写出来的JavaScript脚本在多种浏览器环境里运行,就必须编写许多用来探测浏览器的具体品牌和具体版本的测试及分支代码(术语称之为“浏览器嗅探”代码)。这样的脚本往往到处是if...else语句,既不容易阅读,又不容易复查和纠错,更难以做到让同一个脚本适用于所有的浏览器。第二,对广大的网民来说,JavaScript网页的可访问性很差——浏览器会时不时地弹出一个报错窗口甚至导致系统死机,让人乘兴而来、败兴而去。第三,JavaScript被很多网站用来实现弹出广告窗口的功能,人们厌烦这样的广告,也就“恨”屋及乌地厌烦起JavaScript来了。第四,“JavaScript”这个名字里的“Java”往往让人们误以为其源于Java语言,而实际接触之后才发现它们根本没有任何联系。与Java语言相比,JavaScript语言要简单得多。很多程序员宁肯钻研Java,也不愿意去了解JavaScript的功能和用法。

不管什么原因,JavaScript曾经不受欢迎的确是一个事实。

现在,情况发生了极大的变化。因为几项新技术的出现,JavaScript的春天似乎来了。首先,W3C(万维网联盟)推出的标准化DOM(Document Object Model,文档对象模型)已经一统江湖,目前市场上常见的浏览器可以说没有不支持的。这对网页设计者来说意味着可以用简单的“对象检测”代码来取代那些繁复的浏览器嗅探代码,而按照DOM编写出来的JavaScript页面不像过去那样容易出问题,这对网民来说意味着浏览体验变得流畅了。其次,最近兴起的Ajax技术以DOM和JavaScript语言(以及CSS和XHTML)为基本要素,基于Ajax技术的网站离不开JavaScript和DOM脚本。

其实,人们对JavaScript的恶劣印象在很大程度上来源于早期的程序员对这种语言的滥用。如果程序员在编写JavaScript脚本的时候能够把问题考虑得面面俱到,就可以避免许多问题,但可惜的是如此优秀的程序员太少了。事实上,即使是在JavaScript已经开始流行起来的今天,如果程序员在编写JavaScript脚本的时候不遵守相关的标准和编程准则,也仍会导致各种各样的问题。

在2002年前后,CSS也是一种不太受人们欢迎的Web显示语言,除了用它来改变一下字体,几乎没有人用它来干其他的事情。但没过多久,人们对利用CSS设计网页布局的兴趣就一发而不可收拾,整个潮流也从那时扭转了过来。现在,掌握CSS已经成为许多公司在招聘网站开发人员时的一项要求。

目前,DOM编程技术的现状与CSS技术在2002年时的境况颇有几分相似。受Google Maps和Flickr等著名公司利用DOM编程技术推出的Gmail、Google Suggest等新型服务的影响和带动, DOM编程人才的需求正日益增加。有越来越多的人开始迷上了脚本编程技术,并开始学习如何利用DOM技术去改善而不是妨碍网站的可用性和可访问性。

本书的作者Jeremy Keith是Web标准计划DOM Scripting任务组的负责人之一,他在这本书里通过大量示例证明了这样一个事实:只要运用得当,并且注意避开那些“经典的”JavaScript陷阱,DOM编程技术就可以成为Web开发工具箱里又一件功能强大甚至是不可或缺的好东西。

本书并不是一本参考大全类型的图书,作者只重点介绍了几种最有用的DOM方法和属性。本书的精华在于作者在书中提到的关于JavaScript和DOM脚本编程工作的基本原则、良好习惯和正确思路。如果读者能通过书中的几个案例真正领悟这些原则、习惯和思路,就一定能让自己的编程技术再上一个台阶。

这是一本非常实用的好书,是一本值得一读再读的好书。作为本书的译者,我们相信它会让每位读者、自建网站的设计者和来到自建网站的访问者都受益匪浅。

参加本书翻译的人员还有韩兰、李京山、胡晋平、高文雅。

前言


这是一本讲述一种程序设计语言的书,但它不是专门写给程序员的,而主要是写给Web设计师的。具体地说,本书是为那些喜欢使用CSS和HTML并愿意遵守编程规范的Web设计师们编写的。

本书由代码和概念两大部分构成。不要被那些代码吓倒,我知道它们乍看起来很唬人,可只要抓住了代码背后的概念,就会发现你是在用一种新语言去阅读和编写代码。

学习一种新的程序设计语言看起来可能很难,但事实却并非如此。DOM脚本看起来似乎比CSS更复杂,可只要领悟了它的语法,你就会发现自己又掌握了一样功能强大的Web开发工具。归根结底,代码都是思想和概念的体现。

我在这里要告诉大家一个秘密:其实没人能把一种程序设计语言的所有语法和关键字都记住。如果有拿不准的地方,查阅参考书就全解决了。但本书不是一本参考大全。本书只介绍最基本的JavaScript语法。

本书的真正目的是让大家理解DOM脚本编程技术背后的思路和原则,或许你对其中一部分早就熟悉了。平稳退化、渐进增强、以用户为中心的设计对任何前端Web开发工作都非常重要。这些思路贯穿在本书的所有代码示例中。

你将会看到用来创建图片库页面的脚本、用来创建动画效果的脚本和用来丰富页面元素呈现效果的脚本。如果你愿意,完全可以把这些例子剪贴到自己的代码中,但更重要的是理解这些代码背后的“如何”和“为什么”。

如果你已经在使用CSS和HTML来把设计思路转化为活生生的网页,就应该知道Web标准有多么重要。还记得你是在何时发现自己只需修改一个CSS文件就可以改变整个网站的视觉效果吗?DOM技术有着同样强大的威力。不过,能力越大,责任也就越大。因此,我不仅想让你看到用DOM脚本实现的超酷效果,更想让你看到怎样才能利用DOM脚本编程技术以一种既方便自己更体贴用户的方式去充实和完善网页。

如果需要本书所讨论的相关代码 ,到网站搜索本书的主页就可以查到。还可以在这个网站找到friends of ED出版社的所有其他好书,内容涉及Web标准、Flash、DreamWeaver以及许多细分的计算机领域。

你对JavaScript的探索不应该在合上本书时就停止下来。

媒体评论


《JavaScript DOM编程艺术:第2版》不愧为经典。文笔清新,深入浅出,不知不觉让你掌握优秀的编程原则,明白为什么要遵守标准。

——Slashdot

我要隆重推荐本书。它前所未有地演示了DOM脚本编程的真正潜力。无论你是JavaScript新手还是专家,本书都绝对值得你拥有。

——Garrett Dimon,Digital-Web com杂志专栏作家

序言


第2版已经出版了。

首先,我要澄清一点:虽然我的名字印在了封面上,但我并没有参与这个版本的修订工作。这个新版本完全出自Jeffrey Sambells之手。出版社因为出新版的事找过我,但我的时间确实安排不开了。因此,看到自己的名字忝列其间,心中不禁顿生愧意。

我很高兴地向读者朋友们报告,新版本中所有的修订都非常符合我的期望——英文原书的封面除外。但不管怎么说,第二版的内容真的是太好了!在上一版的基础上,新版经过了扩展,涵盖了如下三个新领域:

HTML5

Ajax

JavaScript库(尤其是jQuery)

相比之下,新版的内容又扩充了不少,但整本书仍然一直在强调最佳实践(特别是渐进增强),这正是让我喜出望外的地方。

新版本中的代码示例全部换成用HTML5标记来写了。有关Ajax的示例代码也精简得当,尽管简略,但上下文仍然能够传达出我在Bulletproof Ajax 中提出的观点:永远不要假设Ajax(或JavaScript,等等)一定可用。

最让我高兴的一点,就是新版本增加了主要介绍jQuery的章节。这一章把本书前面的典型代码示例,使用jQuery重写了一遍。这样一来,正好解释了人们对为什么使用库的种种疑问。它让你先理解了底层代码的工作原理,然后再告诉你使用库为什么能节省时间和精力。

总而言之,这本书新增的内容都十分精彩,对读者绝对有用。为了尽量多展示一些jQuery的方法,也限于篇幅,这一版以介绍库的附录代替了上一版介绍DOM方法的附录。这多少让我感到有一些遗憾,不过,我会争取在自己的博客上公布第1版的附录。

最后,我还是要给第2版再竖竖大拇指,另外再给读者一点建议。如果你买过本书第1版,恐怕找一些专门讲HTML5、Ajax或jQuery的书看会比较好。但如果你就是想知道怎么才能正确地使用JavaScript,那这个经过扩展的新版本就是你的最佳选择。

Jeremy Keith

2011年1月3日

致谢

没有我的朋友和同事Andy Budd 与Richard Rutter的帮助,本书的面世就无从谈起。Andy在我们的家乡Brighton开设了一个名为Skillswap。的免费培训网站。在2004年7月,Richard和我在那里做了一次关于JavaScript和DOM的联合演讲。演讲结束后,我们来到附近的一家小酒馆,在那里,Andy建议我把演讲的内容扩展成一本书,也就是本书的第1版。

如果没有两方面的帮助,我大概永远也学不会编写JavaScript代码。一方面是几乎每个Web浏览器里都有“view source”(查看源代码)选项。谢谢你,“view source”。另一方面是那些多年来一直在编写让人叹为观止的代码并解说重要思路的JavaScript大师们。Scott Andrew、Aaron Boodman、Steve Champeon、Peter-Paul Koch、Stuart Langridge和Simon Willison只是我现在能想到的几位。感谢你们所有人的分享精神。

感谢Molly Holzschlag与我分享她的经验和忠告,感谢她对本书初稿给予反馈意见。感谢Derek Featherstone与我多次愉快地讨论JavaScript问题,我喜欢他思考和分析问题的方法。

我还要特别感谢Aaron Gustafson,他在我写作本书期间向我提供了许多宝贵的反馈和灵感。

在写作第1版期间,我有幸参加了两次非常棒的盛会:在得克萨斯州Austin举办的“South by Southwest”和在伦敦举办的@media。我要感谢这两次盛会的组织者Hugh Forrest和Patrick Griffiths,是他们让我有机会结识那么多最友善的人——我从没想过我能有机会与他们成为朋友和同事。

最后,我要感谢我的妻子Jessica Spengler,不仅因为她永远不变的支持,还因为她在本书初稿的校对工作中做出的专业帮助。谢谢你,我的人生伴侣。

——Jeremy Keith

相关分词: JavaScript DOM 经典 编程 艺术