1、JavaScript核心技术 目录 http:/ 2007-8-1 20:55:00 图书导读 当前章节:目录1.1 规范和实现相互交织的历史1.2 跨浏览器的不兼容性和其他常见的JavaScript传说1.3 你能用 JavaScript 来做什么1.4 JavaS cript初探:“Hello World!”1.5 JavaS cript沙箱1.6 可访问性和JavaScript的最佳实践.Net 程序员不得不看 的 C#经典书籍22 本 C#经典著作 部分图书提供连载 CSDN 读书频道独家奉献 AJAX 学习必备的三本书AJAX 图书十几本?那本书最适合您? CSDN 读书频道独家奉
2、献 1 章 JavaScript初探 71.1 规范和实现相互交织的历史 81.2 跨浏览器的不兼容性和其他常见的JavaScript传说 101.3 你能用 JavaScript 来做什么 111.4 JavaScript初探:“Hello World!” 121.5 JavaScript沙箱 231.6 可访问性和JavaS cript的最佳实践 24第 2 章 JavaScript数据类型与变量 322.1 变量的标识 322.2 作用域 372.3 简单类型 412.4 常量:有名称但不改变 502.5 习题 50第 3 章 运算符和语 句 513.1 JavaScript语句的格式
3、 513.2 简单语句 533.3 条件语句和程序流 593.4 条件运算符 663.5 逻辑运算符 713.6 高级语句:循环语句 723.7 习题 76第 4 章 JavaScript对象 774.1 对象构造函数 774.2 Number 对象 784.3 String 对象 804.4 正则表达式与 RegExp 854.5 有专门用途的对象:Date 和Math 924.6 JavaScript数组 994.7 关联数组:不是数组的数组 1034.8 习题 104第 5 章 函数 1055.1 定义函数:细数所有方式 1055.2 回调函数 1135.3 函数和递归 1155.4 嵌
4、套函数、函数闭包和内存泄漏 1175.5 作为对象的函数 1205.6 习题 121第 6 章 捕捉事件 1226.1 0 级 DOM上的事件句柄 1236.2 2 级 DOM上的事件句柄 1336.3 产生事件 1396.4 习题 140第 7 章 表单与即时 验证 1427.1 访问表单 1427.2 把事件附加在表单上:不同的方法 1437.3 选择列表 1447.4 单选按钮和复选框 1487.5 输入字段和JiT 正则表达式 1547.6 习题 157第 8 章 沙箱及之上 的 cookie、连通性和隐私 1588.1 沙箱 1598.2 关于 cookie 的一切 1618.3 备
5、选存储技术 1668.4 跨站脚本(XSS ) 1708.5 习题 172第 9 章 基础浏览器 对象 1749.1 BOM 总述 1749.2 window 对象 1759.3 框架和地址 1849.4 histo ry、scree n 和 navigator 1909.5 document 对象 1959.6 有旧、有新 2019.7 习题 202第 10 章 DOM:文档对象模 型 20310.1 两种接口的故事 20410.2 DOM 和兼容浏览器 20510.3 DOM 的 HTML API 20610.4 理解 DOM:核心 API 21310.5 DOM 的核心文档对象 2201
6、0.6 Eleme nt 及在上下文中访问 元素 22310.7 修改树 22510.8 习题 228第 11 章 创建定制的 JavaScript对象 22911.1 JavaS cript对象和原型 23011.2 创建自己的定制 JavaScript 对象 23111.3 对象检测、封装和跨浏览器对象 23611.4 链式构造函数和 JS 继 承 24111.5 一次性对象 24311.6 高级错误处理技术(try、throw和 catch) 24511.7 JavaS cript中的新特性 24911.8 习题 251第 12 章 构建动态网 页:在脚本中加 入样式 25312.1 D
7、HTML :JavaS cript、CSS 和 DOM 25412.2 字体和文本 25912.3 定位和移动 26212.4 调整大小和修剪形状 27012.5 属性 display、visibility和 opacity 27512.6 习题 281第 13 章 使用 Ajax 28213.1 Ajax:不仅是代码 28313.2 Ajax 如何工作 28513.3 Hello Ajax World! 28613.4 Ajax 对象: XMLHttpRequest 和IE 的 ActiveX对象 28913.5 是否使用 XML 29313.6 Google Maps 30013.7 习题
8、 303第 14 章 好消息:生动的程序库!令人惊异的 Web 服务!有趣的 API! 30414.1 在开始之前,要注意的一句话 30414.2 使用 Prototype 30514.3 Script.aculo.us 介绍 31114.4 Sabre 的 Rico 31414.5 Dojo 31714.6 Yahoo! UI 32114.7 MochiKit 32414.8 习题 328附录 习题答案 330JavaScript是一种广泛使用的编程语言;它也是被误解最多的一种语言。近几年,它得到了飞速发展,大多数网站都以某种形式使用它。它基于构件的能力简化了那些日益复杂的程序库的创建工作。
9、这些程序库在 Web 页面中所提供的效果,在过去大都需要安装一个外部应用程序才能实现。它也可以和服务器端应用程序紧密集成在一起,而这些服务器端应用程序往往使用各种各样语言开发并与多种数据库接口。正因为这些原因,JavaScript往往被视作一种轻量级的、不复杂的、不像一种“真正的编程语言” 的编程语言。在某些方面,JavaScript太容易使用了。对于它的批评者来说,它规范性久缺;它的面向对象的能力不是真正的面向对象(OO);它存在于一个简化环境之中,只是功能的一个子集;它不安全;它是宽松类型(loosely typed)的;它不能编译 成字节或位。我想起在几年前阅读过的一个 JavaScri
10、pt 的介绍,告诫我们不要被 JavaScript 的名字所迷惑:JavaScript和 Java没有什么关系。毕竟,Java 很难学。那么,实际情况又怎样呢?JavaScript 到底是一种有趣的、轻量级的、有用但却不被认真对待的小脚本语言呢?还是一种可信任的、可用来实现网站的最重要功能的、强大的编程语言呢?JavaS cript的真实情况是:它是将两种语言合二为一的语言;也正是这一真实情况令人混淆。第一种语言是内置在 Web 浏览器和其他应用程序中的、用户友好的、易于使用的脚本语言,它能提供表单验证之类的功能,还有下拉菜单、数据更新时的颜色渐变和即席编辑页面之类的、很酷的新玩意。因为它实现
11、于一个特定的环境中,通常是一个带有一些表单的 Web 浏览器中,这同时也是一个受保护的环境。JavaS cript不需要具备管理文件、内存或很多其他编程语言的基础功能,这使得 JavaScript 更加精益,更加简单。无论你是否有 JS 的经历,是否受过 JS 训练,甚至不论你 以前是否有过编程经验 ,都可以开始JS 的编程。而第二种语言是一种成熟的、功能完备的、限制严格的、基于对象的语言。它确实需要你对它有更深一层的理解。如果使用得当,在只对服务器端的应用做一点点修改甚至是不修改的情况下它就能帮助 Web 应用扩展规模(增加其用户数)。它能够简化网站的开发工作,同时又提高网站的成熟度,使一个
12、好的站点在其访问者面前表现得更好。如果使用不当,JavaScript也会产生站点的安全漏洞,尤其是在与其他功能(比如 Web服务或数据库表单)组合使用的时候。它还会使页面变得无法使用、不可读和可访问性降低。在本书中,将向你介绍上面所描述过的两种语言:有趣的脚本语言和强大的面向对象的编程语言。更重要的是,本书将向你展示如何正确地使用 JavaScript。1.1 规范和实现相互交织的历史学习一种编程语言并不需要学习它的历史,但学习 JavaScript 却例外,因为它的历史反映在今天的 Web页面中。JavaScript是由 Netscape公司发明的 ,最初开发它是为了进行LiveConnec
13、 t 服务器端的开发。Netscape 当时想要一种能实现与服务器端构件接口的脚本语 言,于是就创造了这一脚本语言,并起名叫“LiveScript”。后来,在和 SUN(Java 语言的所有者)合作之后,Netscape的工程师将 LiveScript 改名为 JavaScript,尽管它过去和现在都与 Java 没有关系。著名的 JavaScript 权威Steven Champeon 这样写道:让我们回到1995 年初。Netscape 刚刚聘用了从 MicroUnity Systems Engineering 出来的Brendan Eich,让他负责设计和实现一种新语言。分配给他的任务是
14、让新加入到 Navigator中的 Java 支持能够更方便地被非 Java 程序员的访问,Eich 最终断定:宽松类型的脚本语言才适合这样的环境;也就是说,读者(也就是数千的 Web 设计师和开发人员)既不需要使用字节码编译器,也不需要具备面向对象的软件设计知识,就能够把页面元素(比如表单、框架或图片)结合在一起。为了反映语言的动态本质,他所创造的语言命名为“LiveScript” 。但是没多久(在 Navigator 2.0 beta 开发结束之前),它就被更名 为 JavaScript。一个市场驱 动的、并使 Web设计师们困扰了好几年的错误就这样出炉了,他们在邮件列表和 Usenet
15、上不断地把这两种语言弄混。1995 年12 月 4 号,Netscape 和 Sun 联合宣布了这一新语言的诞生,并称其是 HTML和 Java 二者的补充。(摘自JavaScript: How Did We Get Here?,OReilly Network,2001 年 4 月)。为了不在技术上落后,Microsoft 通过发布 IE浏览器和它自己的脚本语言 VBScript (源自于微软的流行产品Visua l Basic)来反击 Netscape 的进攻。后来,微软也发布了自己的类JavaScript语言版本:JScri pt。这场浏览器及语言上的竞争冲击到很多公司对JavaScrip
16、t的早期接受,尤其是最难以克服的挑战是:对于日益增长的页面,如何维护其跨浏览器的兼容性,更别提在提及名字的时候会造成的那种混淆了。为了避开兼容性问题,Netscape 在 1996 年将JavaScript的规范提交给国际组织欧洲计算机制造商协会(European Computer Manufacturers Association,ECMA),并将其作为一个标准化的成果来重新发布。来自 Sun、Microsoft 、Netsc ape 以及其他对 JavaScript 进行了投资的公司的工程师应邀参与了这一过程,其结果就是在 1997年 6 月发布了 ECMAScript 规范的第1 个版本
17、:ECMA-262 。从那时起,大多数公司都支持一个公认的 JavaScript(或者说 JScript 或 ECMAScript)版本,至少是支持ECMA-262。你可以从 http:/www.ecma-international. org/ publications/ standards/ Ecma-262.htm 下载 ECMA-262 的 PDF 文件。它不是一本让人兴奋的读物,但却是一本很适合放在身边的参考书。严格地说,ECMA-262 的第2 个版本只是一个维护版本。第 3 版,也就是当前的版本发布于 1999年 12 月。然而,如果随着 ECMA-262 的通过,这一混淆就结束了
18、的话,那就不是 JavaScript 了。使Web 发生混乱的是关于新版本的 ECMAScript(即 ECMA-357)的讨论。然而,ECMA-357不是ECMAScript的新版本;它是一个叫 做 E4X 的扩展。这一扩展的目的就是为ECMA-262增加原生 XML能力。ECMA-357 发表于 2004年,而现在 JavaScript 1.6 已经部分实现了 E4X。重要的是要记住,有很多老版本的脚本语言至今仍然还在使用。发现老的 JScript 或者最早版本的 JavaScript 并不稀奇。为了澄清脚本语言的各种版本及其相互关系,表 1-1 给出了 JavaScript、Jscrip
19、t 和 ECMAScript 版本之间的大致关系,还指出了当前流行的 Web 浏览器支持它们的哪个版本。表 1-1:浏览器对脚本的支持浏览器 脚本支持 文档 URL Internet Explorer 6.x ECMA-262(v3) /JScript 5.6 http:/ default.asp?url=/library/en-us/script56/ html/1e9b3876-3d38-4fd8-8596-1bbfe 2330aa9.asp (续)浏览器 脚本支持 文档 URL Internet Explorer 7.x ECMA-262 (v3) /JScript 5.6 http:/
20、 (Windows XP) Opera 8 and 8.5 ECMA-262 (v3) / http:/ JavaScript 1.5 js/ecma/ Firefox 1.5 ECMA-262 (v3) JavaScript 1.5 核心参考文档:部分支持 ECMA-357 (E4X) http:/developer.mozilla.org/en/docs/ /JavaScript 1.6 Core_JavaScript_1.5_Reference/ JavaScript 1.6 核心参考文档:http:/developer.mozilla.org/en/docs/ New_in_JavaS
21、cript_1.6 Tiger上的 Safari 2.x ECMA-262 (v3) http:/ SafariJSProgTopics/index.html Camino 1.0 ECMA-262 (v3) /JavaScript 1.5 http:/www.caminobrowser.org/ Netscape 8.1 ECMA-262 (v3) /JavaScript 1.5 http:/ 各种无线设备 各不相同 此站点包含了对于一些模拟器和测试的浏览器 工具的参考: http:/www.wireless- category=4 当你访问一个 Web 页面并想知道其如何实现某个特性时,你
22、通常可以根据它们如何声明脚本块来断定它们使用了什么版本的 JavaScript。另外,这些老语言的一些部分还在影响 JS的更现代的版本。在本章的后面,我们将更近距离地考察这些脚本块,我们还将看到老浏览器的影响贯穿本书,但是,重要的是要知道老版本的 JavaScript 及其变种依然影响着今天的应用。贯穿本书的始终,我都会交替使用 JavaScript 和 JS这两种写法。另外,除非特别注明,本书中的例子都基于 ECMA-262 和 JavaScript 1.5/1.6。1.2 跨浏览器的不兼容性和其他常见的JavaScript传说JavaScript语言要运行在多种环境和多种平台之上。它能用来
23、开发 Web 页面(和其他的应用),这些页面将会运行于 Mac OS X、Windows 和 Linux 等操作系统中。它不需要任何专门的下载或安装,因为无论你选择使用什么浏览器,浏览器中都内置了 JavaScript。很多浏览器都实现了 JavaScript 的一个公共子集,这使得大部分代码在不同浏览器上都能很好地兼容。这会令人混淆:既然语言的实现类似,那么跨浏览器的不兼容问题又会出现在哪里呢?大多数跨浏览器不兼容的问题都是由于浏览器所开放的底层的文档对象模型(Document Object Model,DOM)不同,而不是因为语言本身。例如,一个 JavaScript语言的对象可以是Dat
24、e 或Strin g;无论在 Safari 还是 Navigator中实现,它都还是 Date 或String。一个 DOM的实例对象应该是一个document 对象,它代表了浏览器中保存Web 页面的那一部分。在不同的浏览器各自对JavaScript (或 ECMAScript)的实现中,如何开放和操作这些 DOM 对象,这导致了浏览器之间的不兼容性。混淆的另一个地方关系到:在 Web 页面中,哪些由 JavaScript 处理,哪些又是通过使用级联样式表(Cascading Style Sheet,CSS)来处理的。对于页面中的元素,JavaScript所能做的主要是创建元素、删除元素或者
25、更改元素的属性。而这些属性中,有一些又可以通过CSS 样式属性来定义。CSS 可以定义 Web页面中的元素的外观,还可以定义元素的某些行为。它能够隐藏或显示元素、改变颜色或字体、移动、改变大小或设置元素的形状等等。每种浏览器对于 CSS的实现可能有所不同,这也导致了一些跨浏览器不兼容的问题。然而,JavaScript所做的一切,就是改变一个元素的 CSS 样式属性。ECMAScript一致声称所 有内置的 JavaScript 对象是相同的,但是在各种浏览器之间还是存在一些小的差异。然而,对于大多数情况来说,过去的跨浏览器问题都是因为 DOM 或 CSS的不同。1.3 你能用 JavaScri
26、pt 来做什么在得到广泛使用的早期,JavaScript 用于一些简单的任务:验证表格内容或设置和检索 cookie(cooki e 能在浏览器关闭时持 久保存少量字节数的信息)。在 20 世纪90 年代的后期,随着动态 HTML(Dynam ic HTML,DHTML)的引入,JavaScript也通过下拉菜单之类提供更加动态的用户体验。JavaScript最近的爆炸式流行,是因为它是Ajax (Async hronous JavaScript and XML,异步 JavaScript 和 XML)的一个关键部分。Ajax 自称将重新构造 Web 应用程序与用户的交互方式。随着时间的推移,
27、很多跨平台的问题都已解决了,并且语言也变得更加成熟,因此 JavaScript 也不再仅仅是一种脚本语言,它已成为了一种功能全面的编程语言。那么你可以用 JavaScript 来做什么呢?对于初学者来说,可以使用 JavaScript:验证表单字段在把内容提交给服务器之前,验证表单中的输入。这样既节省了时间又节约了服务器的资源,还提供了及时的反馈。设置和检索 Web cookie 将用户名、账户或偏好设置之类的信息持久地保存于一个受控且安全的环境中。这样,在用户下一次访问此站点时,就能节省用户的时间。动态地更改页面元素的外观通过突出显示不正确的表单条目来提供反馈;根据读者的请求,将某部分的字体
28、变大。隐藏和显示元素根据用户的偏好设置或用户的操作,显示或隐藏页面的内容(比如表单元素)展开编辑框以及改变一个图片的显示大小。在页面上移动元素创建一个下拉菜单,或提供一个动画光标来突出页面元素。捕捉用户事件并相应地调整页面根据键盘或鼠标的动作,使页面的某一部分变得可编辑。滚动内容对于较大的图片或内容区域,提供一种用鼠标或键盘抓住元素的方式,并可以对其进行上下左右的滚动。在不离开本页面的情况下与服务器端应用程序进行连接这是 Ajax的基础,可以用于填充选项列表、更新数据以及刷新显示,而这一切都不需要重新载入页面。这有助于减少与服务器的交互次数,而与服务器的交互在时间和资源方面的代价都很高。你能做
29、什么呢?可能问你不能做什么更好一些。1.4 JavaScript初探:“Hello World!”JavsScript如此流行的原因之一是:把 JavaScript 加入到 Web 页面中比较简单。最少情况下,你所要做的事情,只是在页面中包含一个HTML 的script 标记,将 type属性设为 JavaScript 语言,然后增加想要的 JavaScript 代码:.some JavaScriptscript 标记通常加在文档的head 元素中(head 标记的开始和结束之间),但也可以包含在body 元素中,还可以包含在这两部分之中。例 1-1 显示了一个完整的、合格的 Web 页面,其
30、中包括一个 JavaScript 语句块,它使用内置的 alert 函数来打开一个消息框,消息框中显示的是“Hello, World!”。例 1-1:文档 head 中的 JavaScript 语句块Example 1-1var dt = Date();/ say hello to the worldvar msg = Hello, World! Today is + dt;alert(msg);将其复制到一个文件中,然后在任意一个浏览器中打开此文件。在页面加载后,立刻会弹出一个消息框。如果不是这样,可能是因为浏览器中禁用了 JavaScript,或者是因为浏览器不支持 JavaScript这
31、种情况在今天很少见。虽然本例很简单,它还是展示了当前所使用的大多数JavaScript应用的基本部件。它值得我们进一步研究。本书中的例子的设计都符合 XHTML,这就意味着它们都包含DOCTYPE、文档标题和内容类型。在你重写这些例子时,可以丢掉这些。然而,较好的方式应该是:创建一个包含了 DOCTYPE、标题、内容类型、 head、body 的Web 页面框架,然后将其复制后用于大多数的例子。1.4.1 script 标记与其他语言不同,JavaScript 几乎总是嵌入到另一种语言的环境之中,比如 HTML 和 XHTML(它们都是真正的语言,虽然动态的部分可能不是那么明显)。我这么说的意
32、思是:脚本如何加到页面上是有限制的。你不能随心所欲地在页面中加入 JS。即便是在用于其他非 Web 环境之中时,JavaScript通常也是文档或模版中的一部分。在例 1-1 中,(X)HTML 的script 元素标记中间包含的是 JavaScript。这使浏览器知道:当它遇到这一标记时,它不应将此标记的内容处理成 HTML 或 XHTML。从这一点开始,对于内容的控制权已转移给了另一个内置的浏览器代理,也就是脚本引擎。并非所有嵌入到 Web页面中的脚本都是 JavaScript,script 标记中包含了一个定义脚本类型的属性。在本例中,type 属 性的值为 text/javascrip
33、t。type 属性的其他允许值为: text/ecmascript text/jscript text/vbscript text/vbs 第 1 个是 JavaScript 的另一种说法,接下来是 Microsoft 在 IE 中实现的一个 JavaScript 的变种,最后两个是VBScript。所有的这些type 值都描述了内 容的 MIME 类型。MIME 也就是多功能邮件传递扩展标准(Multipurpose Internet Mail Extension),这是一种确定内容如何编码(如 text文本)以及内容的特定格式是什么(javascript)的方式。此概念是从电子邮件技术中产
34、生的,但它很快扩展到其他的因特网用途中,比如指明一个脚本块中的脚本类型。提供了 MIME 类型,那些能够处理这一类型的浏览器就会执行它,而不能处理这一类型的浏览器就会跳过这一部分。这确保了脚本只由那些能够处理它的应用程序访问。script 标记的早期版本采用了一个 language 属性,它用于指明语言的版本,就像 type 属性的值为 javascript 那样,相应的 language 的值应为javascript 1.2。然而,尽管仍能看到很多这么写的 JavaScript 的例子,但 HTML 4.01 反对使 用 language 属性。这其中涉及一项最早的跨浏览器技术。几年前,在处
35、理跨浏览器的兼容性问题时,针对每种浏览器专门创建脚本并不罕见。针对不同浏览器的脚本分别保存在不同的部分或文件之中,然后使用 language 属性来确保只有兼容的浏览器可以访问这一代码。让我们来看一下过去的(大概 1997 年左右)DHTML的例子:这种方法的思路是:只有那些能 处理 JavaScript 1.2 的浏览器才会使用第1 个语句块(那时主要是指 Navigator 4.x),而只有那些能处理 JScript的浏览器才会使用第 2个语句块(IE4)。够勉强的吧?确实,但是在早期 的那些年,在试图处理 频繁受阻的跨浏览器 DHTML 的 时候,一直都是使用这种凑合的方法。然而最终,人
36、们的偏好转向一种叫做对象检测的方式,这种方法只是在不赞成使用 language属性的情况下才鼓励使用的。我们会在后面的章节中更详细地探讨对象检测,特别是在那些与 Ajax 相关的章节中。目前,对象检测的方式是:测试某个特定的对象或对象的属性是否存在;如果存在,就执行 JavaScript 的一个分支,否则就执行另一个分支。我们回过头来继续说 script标记,此标记其他的有效属性是 src、defer和 charset。charset属性定义了脚本使用的字符编码方式。除非你需要使用的字符编码方式与文档所定义的字符编码方式不同,这一属性通常不需要设置。一个非常有用的属性是defer。如果把 de
37、fer 属性的值设为 “defer”的话,它会告诉浏览器:脚本不会生成任何文档内容,浏览器可以继续处理页面的其他部分,当页面处理和显示完成之后再返回到脚本:.no content being generated在使用一个较大的 JavaScript 语句块或引用一个较大的 JS 库时,使用这一属性有助于加快页面加载的速度。最后一个属性是 src,它和加载这样的程序库有关,我们在后面再来探究它。1.4.2 JavaScript代码的位置在例 1-1 中,JavaScript语句块嵌入 在 Web 页面的 head 元素中。脚本也可以包含在 body中,例 1-2 是修改后的应用程序。例 1-2:
38、将 JavaScript 嵌入到文 档 body标记中JavaScript Code Block Example/Hello, World! Today is + dt + ;document. writeln(msg);/注意:在本例中,没有使用 alert 函数,而是直接使用 DOM 中的 document 对象向页面写信息。对于 JS 在什么时候应该包含在 head 中,什么时候应当包含在 body 中,人们有着不同的看法。但下面的规则是适用的:1 1. 当 JavaScript 要在页面加载过程中动态建立一些 Web 页面的内容时,应将 JavaScript 放在 body 中。2 2
39、. 定义为函数并用于页面 事件的 JavaScript 应当 放在 head 标记中,因为它会在body 之前加载。放置脚本的一个很好的经验规则是:仅当页面载入期间脚本会建立一些Web 页面内容时,才将脚本嵌入在 body 中;否则,将其放在 head 元素中。采用这种方法,页面就不会被脚本搞得一团糟,在每个页面中,总可以在同一个位置找到脚本。有种方法可以避免将 JavaScript 插入到 body 中,即使用 DOM 生成一个新内容,再将其附加给一个页面元素。本书的后面会介绍这种方法。1.4.3 隐藏脚本在例 1-2 中,脚本块包含在一个 XHTML CDATA块之中。XHTML 处理器不
40、会解释 CDATA块中所含的数据。使用 CDATA 块的原因是:XHTML处理器会解释诸如 header (H3)的开始和结束等标记,即便这些标记包含在 JavaScript 字符串中也要解释。如果不使用CDATA,虽然页面可能会显示正确,但是当你进行页面验证时,会看到有验证错误。那些通过使用 SRC 属性而导入到页面中的 JavaScript,会被假设为与 XHTML 兼容,因而不需要用 CDATA 块。但是,内联的或嵌入的 JS 应当使用 CDATA 来隔开,尤其是当它包含在 BODY 元素之 中时。对于大多数浏览器,你还需要使用 JavaScript 注释符号(/)来隐藏 CDATA 块
41、的开始和结束标记。否则,就会得到一个 JavaScript 错误。JavaScript最佳实践:同时使用 CDATA 块和 JavaScript 注释很重 要,这是本书将介绍的众多JavaS cript最佳实践中的第一条。在使用一个XHTML DOCTYPE 时,应将内联 JavaScript 或嵌入 JavaScript 包含在CDATA块中,然后再使用JavaScript注释将 CDATA 块注释掉。Web 页面应当总是采取 XHTML 格式,因此总要使用 CDATA。当然,保持 Web页面不混乱的最好方式是:从页面中完全删除 JavaScript,转而使用 JavaScript 文件。本
42、书的大多数例子都嵌入在页面中,这主要是为了便于创建。然而,Mozilla Foundation建议:从页面中清除所有内联的或嵌入的JavaS cript,将其放入独立的 JS 文件中。这么做能够防止验证和对文本的不正确解释的问题,而无论页面是作为 HTML 还是 XHTML 处理。JavaScript最佳实践:将 JavaScript 程序代码块放入到外部 JavaScript 文件中。1.4.4 古怪模式与标准模式和 DOCTYPE 在这些例子中,使用的 DOCTYPE是 XHTML 1.0 Transitional(过渡模式),尽管本书的所有例子都用作 HTML,并且带有.html 扩展名
43、。使用 DOCTYPE 可以影响如何解释页面标记、CSS 甚至JavaScript 。所有这些都 基于一个叫做“ 古怪( quirks)”模式,与之对应的就是标准(standards)模式或严格模式。浏览器改进了它们对于标记和 CSS 标准的支持,同时,它们还必须 维持对于为旧浏览器创建的页面的向下兼容。为此,一种方法是按照该浏览器早期支持“古怪” 行为的方式显示这些页面,这种模式就是所谓的“古怪模式” 。根据 DOCTYPE 类型不同,浏览器要么使用诸如 IE 的名声狼藉的 CSS盒子模型缺陷之类的对规范的早期解释来显示页面,要么根据基于标准模式的方式来显示页面。对于大多数浏览器,XHTML
44、 1.0 Transitional DOCTYPE 触发了标准模式,即便页面本身没有说明应作为一个XHTML 文档来解释。要想实际上作为一个 XHTML 来使用,需要将 XHTML MIME 类型传给浏览 器,通常这由扩展名是否为.xhtml来触发。当然,还需要对页面进行其他修改,如确保它是一个合法的XHTML,还要修改 HTML 标记的开始标记,使之包括标记的名字空间,这个名字空间所指的位置有所有元素的定义:对于大多数浏览器,HTML 4.01 strict (严格模式)DOCTYPE 也会触发标准模式,但本书中没有使用,因为它不会验证页面是否使用了适当的 XML标记。例如,在大多数例子中,
45、meta 标记使用了一种带关闭标记的格式:但这对于 HTML 4.01 strict DOCTYPE,是不合法的,对于这种 DOCTYPE 模式,我们需要使用:虽然 HTML 4.01 是一个目前依然支持的标准,但我们应该尽可能养成使用 XHTML 特有标记的习惯,即便是页面仍然作为 HTML 来使用。这意味着:当我们准备删除掉所有HTML,使用纯粹的XHTML 文档时,我们的工作就少了。我前面提到过 DOCTYPE 如何 影响 JavaScript。然而,实际上,它对如何使用该页面文件也有影响。有几个例子都使用了 document.write或 document.writeln。我使用这两个
46、方法的原因是:这些例子修改了页面。在本书的后面,我将介绍文档对象模型(DOM)并展示如何使用“适当”的方法来修改文档。然而,只有当我们 学到那里,并且在那些 提示对话框不能很好起作用的情况下,这些例子才会使用 document.write。遗憾的是,使用 document.writeln 有一个缺点,这就是:在当做 XHTML 来使用的文档中,它是不合法的。实际上,它也不能起作用。显示为 XHTML 的文档不允许 document.write的原因是:XHTML文档被当做是一个合法的XHTML,如果不是就 不会显示。如果我们可以使用 document.write修改文档,浏览器就没办法知道写到
47、页面中的内容是否合法。我们可以引入“坏” 标记,从而来显示对于 XHTML 合法性的保证。在使用 innerHTML(我们将在本书的后面介绍)时,也存在同样的顾虑。然而,大多数浏览器支持这个相当重要的属性,有些浏览器甚至会验证那些用来设置 innerHTML的内容,以确保它是合法的。在本章的其他章节中,都使用了 XHTML 1.0 Transitional DOCTYPE 来确保使用标准模式。然而要记住:名字空间设置( http:/www.w3.org/1999/xhtml)、扩展名(.xhtml),还有是否出现 document.write,都会影响那些实际被作为 XHTML 来使用的文档。在本书可下载的例子中,提供了使用不同文档类型和扩展名的多个版本,用以讨论本节所讨论的差异。每个文件中都使用了注释来讨论为了使文档正确和合法做了哪些变更。1.4.5 JavaScript文件随着 JavaScript 变得更加面向对象和更加复杂,开发人员开始创建可复用的 JS 对象,这些JS 对象用于不同开发者所开 发的各种应用中。复用这些对 象的唯一有效的方法就是:把它们创建在独立的文件中,然后在 Web 页面中提供文件的连接。除了便于复用之外,J