JavaScript 高级程序设计(第3版)

内容简介

ECMAScript 5 和 HTML5 在标准之争中双双胜出,使大量专有实现和客户端扩展正式进入规范,同时也为 JavaScript 增添了很多适应未来发展的新特性。《JavaScript 高级程序设计(第3版)》这一版除增加5章全新内容外,其他章节也有较大幅度的增补和修订,新内容篇幅约占三分之一。全书从 JavaScript 语言实现的各个组成部分——语言核心、DOM、BOM、事件模型讲起,深入浅出地探讨了面向对象编程、Ajax 与 Comet 服务器端通信,HTML5 表单、媒体、Canvas(包括 WebGL)及 Web Workers、地理定位、跨文档传递消息、客户端存储(包括 IndexedDB)等新 API,还介绍了离线应用和与维护、性能、部署相关的开发实践。《JavaScript 高级程序设计(第3版)》附录展望了未来的 API 和 ECMAScript Harmony 规范。

作者简介

泽卡斯(Zakas. Nicholas C.),雅虎首页的主要开发者,雅虎用户界面库(YUI)代码贡献者,擅长利用 JavaScript、HTML、CSS、XML、XSLT 设计和实现 WEB 界面的软件工程师。

本书内容

20多年的职业生涯,我也长出了白头发。回首往事,曾经对我的职业道路产生过重要影响的技术和人历历在目。如果让我只说一种技术,一种对我产生了最大正面影响的技术,那么就是 JavaScript。说实话,我也并非一直都是 JavaScript 的信徒。跟许多人一样,我以前也把它当作一门玩具语言,认为它只能用来做一些旋转的横幅广告,或者在页面中添加一些有意思的交互效果作为装饰。我原来是做服务器端开发的,我们都对这种玩具语言不感冒,该死的!可是,后来 Ajax 出现了。

永远也忘不了当时无孔不入的 Ajax,大家都认为它是一种非常酷、非常新,同时极具创造性的技术。我也开始了解它,阅读相关资料。知道这门曾被我嗤之以鼻的玩具语言如今被每一位专业 Web 开发人员津津乐道之后,我感到很震惊。突然,我的看法就转变了。随着探索 Ajax 的继续深入,我认识到 JavaScript 的强大威力,急切地想了解它能提供的所有“法宝”。于是,我全身心地投入到学习 JavaScript 之中,不仅努力学习这门语言,还加入了 jQuery 项目团队,专门从事客户端开发。我的日子过得很爽。

对JavaScript 了解得越深,接触的开发人员就越多,其中不乏今天在我眼里依然是巨星和导师级的人物。尼古拉斯·泽卡斯(本书作者)就是这样一位开发人员。我一直记得在读本书第2版时心中油然而生的喜悦之情,虽然我也有多年的积累,但仍然从中学到了很多新东西。这本书实实在在、深入浅出,读来就好像尼古拉斯对不同层次的读者都了如指掌,所以他的风格才那么贴切自然。对于技术书来说,这是非常突出的一个特色。多数作者都想靠坚深的技术给人留下印象,但这本书不同。所以,它很快就成为了我案头必备的书,我也会向那些有志全面掌握 JavaScript 的开发人员推荐这本书。我希望每个人对这本书都能有跟我一样的体会,认识到它的价值所在。

后来,在一次 jQuery 大会上,我荣幸地见到了尼古拉斯本人。站在我面前的是一位世界顶级的JavaScript开发人员,而且正负责世界上最重要的一个Web站点(雅虎)。尼古拉斯是我见过的最随和的人之一。真的,见到他的时候我有一种追星族的幻觉。但他就是那么一个活生生的人,一个想帮助开发人员成就梦想的人。不仅他的书改变了我对 JavaScript 的认识,而且尼古拉斯这个人,也让我愿意接近,愿意了解。

听说尼古拉斯要请我作序,我激动得不知道说什么才好。在此,我代表大牛来为本书暖场。这个序也是他本人有多么令人景仰的一个明证。不过,更重要的是,这也给了我一个机会,让我能跟大家分享自己为什么觉得这本书如此重要。我看过很多 JavaScript 图书,的确也有很多令人叹服的佳作。但在我看来,这本书为读者成为全方位的 JavaScript 高手提供了“一揽子方案”。

这本书从介绍表达式和变量声明开始,平滑地过渡到了闭包、面向对象开发等高级主题。与那些把大量篇幅花在讲解背景知识上的书,以及那些让人感觉好像是要使用 JavaScript 开发导弹制导系统的书相比,这本书让人感觉细致周到、亲切自然。这是一本写给“普通人”的书,它能让你编写出引以为荣的代码,构建出令人叫绝的网站。

雷 · 邦戈(Rey Bango)
微软公司高级布道师,jQuery 项目团队核心成员

前言

从驱动全球商业、贸易及管理领域不计其数的复杂应用程序的角度来看,说 JavaScript 已经成为当今世界上最流行的编程语言一点儿都不为过。

JavaScript 是一种非常松散的面向对象语言,也是 Web 开发中极受欢迎的一门语言。JavaScript,尽管它的语法和编程风格与 Java 都很相似,但它却不是 Java 的“轻量级”版本,甚至与 Java 没有任何的关系。JavaScript 是一种全新的动态语言,它植根于全球数亿网民都在使用的 Web 浏览器之中,致力于增强网站和 Web 应用程序的交互性。

在本书中,我们将对 JavaScript 追根溯源,从它在最早的 Netscape 浏览器中诞生谈起,一直谈到今天的它对 DOM 和 Ajax 的强大支持。读者将通过本书掌握如何运用和扩展这门语言,从而更好地满足自己的需求,以及如何实现客户端与服务器的无缝通信,而又不必求助于 Java 或隐藏的网页框架(frame 元素)。一言以蔽之,本书将教会你在面对各种常见的 Web 开发问题时,如何拿出自己的 JavaScript 解决方案。

本书读者对象

本书将下列三类人员作为目标读者:

  1. 熟悉面向对象编程、经验丰富而又打算学习JavaScript 的开发人员,JavaScript 毕竟与Java、C++ 等传统 OO 语言存在着诸多联系;

  2. 有意提升自己网站和 Web 应用程序易用性的 Web 开发人员;

  3. 希望全面深入地理解这门语言的初级 JavaScript 开发人员。

此外,本书也适合熟悉下列相关技术的读者阅读:

  1. Java

  2. PHP

  3. ASP.NET

  4. HTML

  5. CSS

  6. XML

本书不适合没有计算机基础知识的初学者,也不适合只想为网站添加简单交互功能的读者。建议这些朋友学习阅读 Beginning JavaScript, 3rd Edition(Wiley, 2007)一书1

本书内容

本书提供了 JavaScript 开发人员必须掌握的内容,全面涵盖了 JavaScript 的各种高级、有用的特性。

本书首先介绍了 JavaScript 的起源及其发展现状,随后讨论了构成 JavaScript 实现的各个组成部分,重点讲解了 ECMAScript 和 DOM 标准。此外,还对不同 Web 浏览器的 JavaScript 实现之间存在的差异,给出了相应的说明。

在此基础上,本书从讲解 JavaScript 的基本概念入手,探讨了 JavaScript 面向对象程序设计和继承的方式,以及如何在 HTML 等标记语言中使用它。在深入剖析了事件和事件处理之后,又解释了各种浏览器检测技术。本书还探讨了 HTML5、Selectors API 和 File API 等一系列新 API。

本书最后一部分专门讨论了高级主题,涉及性能和内存优化、最佳实践以及对 JavaScript 未来的展望。

本书结构

本书共25章,各章简介如下。

第1章“JavaScript 简介”,讲述了 JavaScript 的起源:因何而生,如何发展,现状如何。涉及的概念主要有J avaScript 与 ECMAScript 之间的关系、DOM(Document Object Model,文档对象模型)、BOM(Browser Object Model,浏览器对象模型)。此外,还将讨论 ECMA(European Computer Manufacturer’s Association,欧洲计算机制造商协会)和 W3C(World Wide Web Consortium,万维网联盟)制定的一些相关标准。

第2章“在 HTML 中使用 JavaScript”,介绍了如何在 HTML 中使用 JavaScript 创建动态网页。这一章不仅展示了在网页中嵌入 JavaScript 的各种方式,还讨论了 JavaScript 内容类型(content-type)及其与元素的关系。

第3章“基本概念”,讨论了 JavaScript 语言的基本概念,包括语法和流控制语句。这一章也分析了 JavaScript 与其他基于 C 的语言在语法上的相同和不同之处,还介绍了与内置操作符有关的类型转换问题。

第4章“变量、作用域和内存问题”,探讨了 JavaScript 如何处理其松散类型的变量。这一章还讨论了原始值和引用值之间的差别,以及与变量有关的执行环境的相应内容。最后,通过介绍 JavaScript 的垃圾收集机制,解释了变量在退出作用域时释放其内存的问题。

第5章“引用类型”,详尽介绍了 JavaScript 内置的所有引用类型,如和。这一章对 ECMA-262 规范中描述的每一种引用类型既做了理论上的阐释,又从浏览器实现的角度给出了介绍。

第6章“面向对象的程序设计”,讲述了在 JavaScript 中如何实现面向对象的程序设计。由于 JavaScript 没有类的概念,因此这一章从对象创建和继承的层面上展示了一些流行的技术。此外,这一章还讲解了函数原型的概念,并对函数原型与整个面向对象方法的关系进行了探讨。

第7章“函数表达式”,集中介绍了 JavaScript 中最为强大的一个特性——函数表达式。相关的内容涉及闭包、对象的角色、模块模式和创建私有对象成员等。

第8章“BOM”,介绍 BOM(Browser Object Model,浏览器对象模型),即负责处理与浏览器自身有关的交互操作的对象集合。这一章全面介绍了每一个BOM对象,包括、、、和。

第9章“客户端检测”,讨论了检测客户端机器及其支持特性的各种手段,包括特性检测及用户代理字符串检测的不同技术。这一章还就每种手段的优缺点及适用情形给出了详细说明。

第10章“DOM”,介绍 DOM(Document Object Model,文档对象模型),即 DOM1 规定的 JavaScript 中的 DOM 对象。这一章也简要介绍了 XML 及其与 DOM 的关系,为深入探讨所有 DOM 规范及其定义的操作网页的方式奠定了基础。

第11章“DOM 扩展”,介绍了其他 API 以及浏览器本身为 DOM 添加的各种功能。涉及内容包括Selectors API、Element Traversal API 和 HTML5 扩展。

第12章“DOM2 和 DOM3”,在前两章的基础上继续探讨了 DOM2 和 DOM3 中新增的 DOM 属性、方法和对象。这一章还讨论了 IE 与其他浏览器的兼容性问题。

第13章“事件”,解释了 JavaScript 中事件的本质,对遗留机制的支持,以及 DOM 对事件机制的重新定义。这一章讨论了多种设备,包括 Wii 和 iPhone。

第14章“表单脚本”,讲述如何使用 JavaScript 增强表单的交互性,突破浏览器的局限性。这一章的讨论主要围绕单个表单元素如文本框、选择框,以及围绕数据验证和操作展开。

第15章“使用 Canvas 绘图”,讨论了标签以及如何通过它来动态绘图。不仅涵盖 2D 上下文,也将讨论 WebGL(3D)上下文,可以为创建动画和游戏夯实基础。

第16章“HTML5 脚本编程”,介绍了 HTML5 规定的 JavaScript API,涉及跨文档传递消息、拖放 API 和以编程方式控制和元素,以及管理历史状态。

第17章“错误处理与调试”,讨论浏览器如何处理 JavaScript 代码错误,并展示了一些处理错误的方式。这一章针对每种浏览器分别讨论了相应的调试工具和技术,还给出了简化调试工作的建议。

第18章“JavaScript 与 XML”,展示了 JavaScript 中用于读取和操作 XML(eXtensible Markup Language,可扩展标记语言)的特性。这一章分析了不同浏览器提供的 XML 支持和对象的差异,给出了编写跨浏览器代码的简易方法。此外,这一章还介绍了用于在客户端转换 XML 数据的 XSLT(eXtensible Stylesheet Language Transformations,可扩展样式表语言转换)技术。

第19章“E4X”,讨论了 E4X(ECMAScript for XML,ECMAScript 中的 XML 扩展);设计 E4X 的出发点是简化 XML 处理任务。这一章探讨了在处理 XML 时,使用 E4X 与使用 DOM 相比有哪些优势。

第20章“JSON”,介绍了作为 XML 替代格式的 JSON,包含浏览器原生支持的 JSON 解析和序列化,以及使用 JSON 时要注意的安全问题。

第21章“Ajax 与 Comet”,讲解了常用的 Ajax 技术,包括使用对象及 CORS(Cross-Origin Resource Sharing,跨来源资源共享)API 实现跨域 Ajax 通信。这一章展示了浏览器在实现与支持方面存在的差异,同时也给出了一些使用建议。

第22章“高级技巧”,深入讲解了一些 JavaScript 中较复杂的模式,包括函数柯里化(currying)、部分函数应用和动态函数。这一章还讨论了如何创建自定义的事件框架和使用 ECMAScript 5 创建防篡改对象。

第23章“离线应用与客户端存储”,讨论了如何检测应用离线以及在客户端机器中存储数据的各种技术。先从受到最广泛支持的特性 cookie 谈起,继而介绍了新兴的客户端存储技术,如 Web Storage 和 IndexedDB。

第24章“最佳实践”,探讨了在企业级环境中使用 JavaScript 的各种方式。其中,着眼于提高可维护性的内容包括编码技巧、格式化和通用编程实践。这一章还介绍了改善代码执行性能及速度优化的一些技术。最后讨论了部署问题,包括如何创建构建过程。

第25章“新兴的 API”,介绍了为增强浏览器中的 JavaScript 而创建的新 API。虽然这些 API 还没有得到完整或全面的支持,但它们已经崭露头角,有些浏览器也已经部分地实现了这些 API。这一章的内容主要是 Web 计时和文件 API。

使用示例

要运行本书中的示例,需要安装下列软件:

  • Windows XP、Windows 7 或 Mac OS X;

  • Internet Explorer 6 及更高版本、Firefox 2 及更高版本、Opera 9 及更高的版本、Chrome、 Safari 2 及更高版本。

完整的示例源代码可以从http://www.wrox.com/中下载(下载步骤见“源代码”一节)2

排版约定

为了让读者更好地理解本书内容,同时把握住全书的重点,本书将采用以下排版约定。

03.QY.01.png 这种带钢笔图标的方框样式,表示与上下文相关的说明、提示、技巧、窍门和背景知识。

正文中的样式说明如下。

  1. 新术语及重要的词汇在首次出现时使用加粗字体以示强调;

  2. 表示键盘命令组合的方式是 Ctrl+A;

  3. 正文中的代码使用等宽字体,如;

  4. 代码有两种样式:

源代码

在学习本书示例代码时,可以手工敲入所有代码,也可以使用随书的源代码文件。本书所有源代码都可以到 www.wrox.com 中下载。登录该站点后,先找到本书(通过搜索或者图书列表),打开本书页面后,单击其中的 Download Code 链接,就可以下载本书的源代码了3。对于包含在下载文件中的源代码,书中会添加以下图标:

03.QY.01.png 由于很多书的书名看起来类似,所以更好的方式是通过书的 ISBN 来搜索它。本书原版的 ISBN 是978-1-118-02669-4。

下载完代码后,请使用解压缩软件将其解压缩。此外,读者也可以登录 Wrox 代码下载主页www.wrox.com/dynamic/books/download.aspx,查找并下载本书及其他 Wrox 图书的示例代码。

勘误信息4

我们尽最大努力确保正文和代码没有错误。可是,金无足赤,错误在所难免。如果读者发现我们书中的任何错误,例如错别字或代码片段无法运行等,希望您能及时给我们反馈。您提交的勘误不仅能让其他读者受益,而且也能帮助我们进一步提高图书质量。

本书原版的勘误页面位于 www.wrox.com 中,登录该站点后可以通过搜索或查询图书列表找到本书页面,然后单击页面中的 Errata(勘误)链接。然后可以看到其他读者已经提交并由 Wrox 的编辑发布的勘误信息。另外,在 www.wrox.com/misc-pages/booklist.shtml 页面中也可以找到本书及勘误页面的链接。

如果读者在本书勘误页面中没有发现“你的”错误,麻烦打开 www.wrox.com/contact/techsupport.shtml 页面,填写其中的表单并将错误发送给我们。我们会认真核对您提交的错误,如果错误确实存在,我们将把它补充到本书勘误页面中。同时,也将根据您提供的信息对本书后续版本加以改正。

p2p.wrox.com

如果您想与本书作者或者其他读者沟通,请加入 P2P 论坛(p2p.wrox.com)。该论坛是基于 Web 的系统,您可以在其中发表与 Wrox 图书及相关技术有关的帖子,并同其他读者或者技术用户交流。论坛提供了一个订阅功能,您可以选择当发表您感兴趣的帖子时通过邮件通知您。Wrox 的作者、编辑、其他行业的专家以及与您正在读同一本书的读者都会出现在这个论坛中。

在 http://p2p.wrox.com 中,有很多论坛不仅对您理解本书有帮助,而且还会对开发应用程序有帮助。要加入这个论坛,请按下面几个步骤进行:

  1. 登录到 p2p.wrox.com,单击 Register(注册)链接;

  2. 阅读使用条款并单击 Agree(同意);

  3. 完成必填信息和您愿意提供的可选信息,然后单击 Submit(提交);

  4. 随后,您会收到一封电子邮件,其中包含如何验证账号和完成注册过程的信息。

04.d01z.01.png

图1-1

1.2.1 ECMAScript

由 ECMA-262 定义的 ECMAScript 与 Web 浏览器没有依赖关系。实际上,这门语言本身并不包含输入和输出定义。ECMA-262 定义的只是这门语言的基础,而在此基础之上可以构建更完善的脚本语言。我们常见的 Web 浏览器只是 ECMAScript 实现可能的宿主环境之一。宿主环境不仅提供基本的 ECMAScript 实现,同时也会提供该语言的扩展,以便语言与环境之间对接交互。而这些扩展——如 DOM,则利用 ECMAScript 的核心类型和语法提供更多更具体的功能,以便实现针对环境的操作。其他宿主环境包括 Node(一种服务器端 JavaScript 平台)和 Adobe Flash。

既然 ECMA-262 标准没有参照 Web 浏览器,那它都规定了些什么内容呢致说来,它规定了这门语言的下列组成部分:

  • 语法
  • 类型
  • 语句
  • 关键字
  • 保留字
  • 操作符
  • 对象

ECMAScript 就是对实现该标准规定的各个方面内容的语言的描述。JavaScript 实现了 ECMAScript,Adobe ActionScript 同样也实现 了ECMAScript。

1. ECMAScript 的版本

ECMAScript 的不同版本又称为版次,以第x版表示(意即描述特定实现的 ECMA-262 规范的第x个版本)。ECMA-262 的最近一版是第5版,发布于2009年。而 ECMA-262 的第1版本质上与 Netscape 的 JavaScript 1.1 相同——只不过删除了所有针对浏览器的代码并作了一些较小的改动:ECMA-262 要求支持 Unicode 标准(从而支持多语言开发),而且对象也变成了平台无关的(Netscape JavaScript 1.1的对象在不同平台中的实现不一样,例如对象)。这也是J avaScript 1.1 和1.2与 ECMA-262 第1版不一致的主要原因。

ECMA-262 第2版主要是编辑加工的结果。这一版中内容的更新是为了与 ISO/IEC-16262 保持严格一致,没有作任何新增、修改或删节处理。因此,一般不使用第2版来衡量 ECMAScript 实现的兼容性。

ECMA-262 第3版才是对该标准第一次真正的修改。修改的内容涉及字符串处理、错误定义和数值输出。这一版还新增了对正则表达式、新控制语句、异常处理的支持,并围绕标准的国际化做出了一些小的修改。从各方面综合来看,第3版标志着 ECMAScript 成为了一门真正的编程语言。

ECMA-262 第4版对这门语言进行了一次全面的检核修订。由于 JavaScript 在 Web 上日益流行,开发人员纷纷建议修订 ECMAScript,以使其能够满足不断增长的 Web 开发需求。作为回应,ECMA TC39 重新召集相关人员共同谋划这门语言的未来。结果,出台后的标准几乎在第3版基础上完全定义了一门新语言。第4版不仅包含了强类型变量、新语句和新数据结构、真正的类和经典继承,还定义了与数据交互的新方式。

与此同时,TC39 下属的一个小组也提出了一个名为 ECMAScript 3.1 的替代性建议,该建议只对这门语言进行了较少的改进。这个小组认为第4版给这门语言带来的跨越太大了。因此,该小组建议对这门语言进行小幅修订,能够在现有 JavaScript 引擎基础上实现。最终,ES3.1 附属委员会获得的支持超过了 TC39,ECMA-262 第4版在正式发布前被放弃。

ECMAScript 3.1 成为 ECMA-262 第5版,并于2009年12月3日正式发布。第5版力求澄清第3版中已知的歧义并增添了新的功能。新功能包括原生 JSON 对象(用于解析和序列化 JSON 数据)、继承的方法和高级属性定义,另外还包含一种严格模式,对 ECMAScript 引擎解释和执行代码进行了补充说明。

2. 什么是 ECMAScript 兼容

ECMA-262 给出了 ECMAScript 兼容的定义。要想成为 ECMAScript 的实现,则该实现必须做到:

  • 支持 ECMA-262 描述的所有“类型、值、对象、属性、函数以及程序句法和语义”(ECMA-262 第1页);

  • 支持 Unicode 字符标准。

此外,兼容的实现还可以进行下列扩展。

  • 添加 ECMA-262 没有描述的“更多类型、值、对象、属性和函数”。ECMA-262 所说的这些新增特性,主要是指该标准中没有规定的新对象和对象的新属性。

  • 支持 ECMA-262 没有定义的“程序和正则表达式语法”。(也就是说,可以修改和扩展内置的正则表达式语法。)

上述要求为兼容实现的开发人员基于 ECMAScript 开发一门新语言提供了广阔的空间和极大的灵活性,这也从另一个侧面说明了 ECMAScript 受开发人员欢迎的原因。

3. Web 浏览器对 ECMAScript 的支持

1996年,Netscape Navigator 3 捆绑发布了 JavaScript 1.1。而相同的 JavaScript 1.1 设计规范随后作为对新标准(ECMA-262)的建议被提交给 Ecma。伴随着 JavaScript 的迅速走红,Netscape 豪情满怀地着手开发 JavaScript 1.2。然而,问题是 Ecma 当时还没有接受 Netscape 的建议。

Netscape Navigator 3 发布后不久,微软也推出了 Internet Explorer 3。微软在 IE 的这一版中捆绑了 JScript 1.0,很多人都认为 JScript 1.0 与 JavaScript 1.1 应该是一样的。但是,由于没有文档依据,加之不适当的特性模仿,JScript 1.0 还是很难与 JavaScript 1.1 相提并论。

1997年,内置 JavaScript 1.2 的 Netscape Navigator 4 发布;而到这一年年底,ECMA-262 第1版也被接受并实现了标准化。结果,虽然 ECMAScript 被认为是基于 JavaScript 1.1 制定的,但 JavaScript 1.2 与 ECMAScript 的第1版并不兼容。

JScript 的升级版是 Internet Explorer 4中内置的 JScript 3.0(随同微软 IIS 3.0发布的 JScript 2.0从来也没有移植到浏览器中)。微软通过媒体大肆宣传 JScript 3.0是世界上第一个 ECMA兼容的脚本语言,但当时的 ECMA-262 尚未定稿。于是,JScript 3.0与 JavaScript 1.2都遭遇了相同的尴尬局面——谁都没有按照最终的 ECMAScript 标准来实现。

Netscape 决定更新其 JavaScript 实现,即在 Netscape Navigator 4.06中发布 JavaScript 1.3,从而做到了与 ECMA-262 的第一个版本完全兼容。在 JavaScript 1.3中,Netscape 增加了对 Unicode标准的支持,并在保留 JavaScript 1.2新增特性的同时实现了所有对象的平台中立化。

在 Netscape 以 Mozilla 项目的名义开放其源代码时,预期 JavaScript 1.4将随同 Netscape Navigator 5一道发布。然而,一个激进的决定,彻底重新设计 Netscape 代码,打乱了原有计划。后来,JavaScript 1.4只发布了针对 Netscape Enterprise Server 的服务器版,而没有内置于 Web 浏览器中。

到了2008年,五大主流 Web 浏览器(IE、Firefox、Safari、Chrome 和 Opera)全部做到了与 ECMA-262 兼容。IE8 是第一个着手实现 ECMA-262 第5版的浏览器,并在 IE9 中提供了完整的支持。Firefox 4也紧随其后做到兼容。下表列出了 ECMAScript 受主流 Web 浏览器支持的情况。

浏 览 器 ECMAScript兼容性 浏 览 器 ECMAScript兼容性
Netscape Navigator 2 Opera 6~7.1 第2版
Netscape Navigator 3 Opera 7.2+ 第3版
Netscape Navigator 4~4.05 Safari 1~2.0.x 第3版*
Netscape Navigator 4.06~4.79 第1版 Safari 3.x 第3版
Netscape 6+(Mozilla 0.6.0+) 第3版 Safari 4.x~5.x 第5版*
IE3 Chrome 1+ 第3版
IE4 Firefox 1~2 第3版
IE5 第1版 Firefox 3.0.x 第3版
IE5.5~IE7 第3版 Firefox 3.5~3.6 第5版*
IE8 第5版* Firefox 4.0 + 第5版
IE9+ 第5版

* 不完全兼容的实现

1.2.2 文档对象模型(DOM)

文档对象模型(DOM,Document Object Model)是针对 XML 但经过扩展用于 HTML 的应用程序编程接口(API,Application Programming Interface)。DOM 把整个页面映射为一个多层节点结构。HTML 或 XML 页面中的每个组成部分都是某种类型的节点,这些节点又包含着不同类型的数据。看下面这个 HTML 页面:

在 DOM 中,这个页面可以通过图1-2所示的分层节点图表示。

通过 DOM 创建的这个表示文档的树形图,开发人员获得了控制页面内容和结构的主动权。借助 DOM 提供的 API,开发人员可以轻松自如地删除、添加、替换或修改任何节点。

1. 为什么要使用 DOM

在 Internet Explorer 4和 Netscape Navigator 4分别支持的不同形式的 DHTML(Dynamic HTML)基础上,开发人员首次无需重新加载网页,就可以修改其外观和内容了。然而,DHTML 在给 Web 技术发展带来巨大进步的同时,也带来了巨大的问题。由于 Netscape 和微软在开发 DHTML 方面各持己见,过去那个只编写一个 HTML 页面就能够在任何浏览器中运行的时代结束了。

对开发人员而言,如果想继续保持 Web 跨平台的天性,就必须额外多做一些工作。而人们真正担心的是,如果不对 Netscape 和微软加以控制,Web 开发领域就会出现技术上两强割据,浏览器互不兼容的局面。此时,负责制定 Web 通信标准的 W3C(World Wide Web Consortium,万维网联盟)开始着手规划DOM。

03.QY.01.png 请读者注意,DOM 并不只是针对 JavaScript 的,很多别的语言也都实现了 DOM。不过,在 Web 浏览器中,基于 ECMAScript 实现的 DOM 的确已经成为 JavaScript 这门语言的一个重要组成部分。

如果说 DOM1 级的目标主要是映射文档的结构,那么 DOM2 级的目标就要宽泛多了。DOM2 级在原来 DOM 的基础上又扩充了(DHTML 一直都支持的)鼠标和用户界面事件、范围、遍历(迭代 DOM 文档的方法)等细分模块,而且通过对象接口增加了对 CSS(Cascading Style Sheets,层叠样式表)的支持。DOM1 级中的 DOM 核心模块也经过扩展开始支持 XML 命名空间。

DOM2 级引入了下列新模块,也给出了众多新类型和新接口的定义。

  • DOM 视图(DOM Views):定义了跟踪不同文档(例如,应用 CSS 之前和之后的文档)视图的接口;

  • DOM 事件(DOM Events):定义了事件和事件处理的接口;

  • DOM 样式(DOM Style):定义了基于 CSS 为元素应用样式的接口;

  • DOM 遍历和范围(DOM Traversal and Range):定义了遍历和操作文档树的接口。

DOM3 级则进一步扩展了 DOM,引入了以统一方式加载和保存文档的方法——在 DOM 加载和保存(DOM Load and Save)模块中定义;新增了验证文档的方法——在 DOM 验证(DOM Validation)模块中定义。DOM3 级也对 DOM 核心进行了扩展,开始支持 XML 1.0 规范,涉及 XML Infoset、XPath 和 XML Base。

03.QY.01.png 请注意,只有 Netscape/Mozilla 浏览器才遵循这种编号模式。例如,IE 的 JScript 就采用了另一种版本命名方案。换句话说,JScript 的版本号与上表中 JavaScript 的版本号之间不存在任何对应关系。而且,大多数浏览器在提及对 JavaScript 的支持情况时,一般都以 ECMAScript 兼容性和对 DOM 的支持情况为准。 JavaScript 是一种专为与网页交互而设计的脚本语言,由下列三个不同的部分组成:

1.4 小结

  • ECMAScript,由 ECMA-262 定义,提供核心语言功能;

  • 文档对象模型(DOM),提供访问和操作网页内容的方法和接口;

  • 浏览器对象模型(BOM),提供与浏览器交互的方法和接口。

JavaScript 的这三个组成部分,在当前五个主要浏览器(IE、Firefox、Chrome、Safari 和 Opera)中都得到了不同程度的支持。其中,所有浏览器对 ECMAScript 第3版的支持大体上都还不错,而对 ECMAScript 5的支持程度越来越高,但对 DOM 的支持则彼此相差比较多。对已经正式纳入 HTML5 标准的 BOM 来说,尽管各浏览器都实现了某些众所周知的共同特性,但其他特性还是会因浏览器而异。


1 对 IE 而言,当我们提到JavaScript时,实际上就是指 IE 对 JavaScript(ECMAScript)的实现——JScript。最早的 JScript 基于 Netscape JavaScript 1.0开发,于1996年8月随同 Internet Explorer 3.0发布。

第2章 在 HTML 中使用 JavaScript
第3章 基本概念(一)

来源:蔚1

声明:本站部分文章及图片转载于互联网,内容版权归原作者所有,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!

上一篇 2018年3月10日
下一篇 2018年3月10日

相关推荐