企业级Web开发实战
上QQ阅读APP看本书,新人免费读10天
设备和账号都新为新人

2.2 一切从浏览器说起

上面我们提到Ajax包含DOM、JavaScript、XML、JSON等各种技术,那么,Ajax又是怎样将这些技术整合在一起的呢?“知今必先通古”,要想了解这一切,还需要从互联网和Web浏览器的发展历史开始说起。

2.2.1互联网和HTML的诞生

1985年,美国国家科学基金组织(NSF)采用TCP/IP协议将分布在美国各地的6个为科研教育服务的超级计算机中心互联,并支持地区网络,形成NSFnet,这标志着Internet的诞生。

1988年,Internet开始对外开放。1989年,Tim Berners-Lee(蒂姆·本尼斯李,见图2-3)根据当时的印刷行业规范SGML制定了HTML(Hyper Text Markup Language)。超文本是指信息内容的组织方式是非线性的,可以根据人的联想方式进行跳转,常见的文字、课本、电视、录像等是线性的、不能跳转的,只能固定从一页到另一页或从一个镜头接另一个镜头,而人类的思维方式是非线性的,可以对某些概念进行发散和跳转。1945年,美国计算机科学家范尼瓦·布什就提出了“有思维的人和所有的知识之间建立一种新的关系”,但是他没有提出明确的概念。美国人泰得·纳尔逊在1965年最先提出了超文本这个词汇,后来得到世界的公认,成了这种非线性信息管理技术的专用词汇。而HTML就是非线性内容的表达语言,允许从当前阅读位置直接切换到超文本链接所指向的目标;允许人们透明地共享网络上的信息,即使人们使用的计算机差别很大。HTML具备以下特点:

图2-3 “万维网之父”、HTML发明人——Tim Berners-Lee

■ 独立于平台,即独立于计算机硬件和操作系统。这个特性是至关重要的,因为在这个特性中,文档可以在具有不同性能(即字体、图形和颜色差异)的计算机上以相似的形式显示文档内容。

■ 超文本。允许文档中的任何文字或词组参照另一文档,这个特性将允许用户在不同计算机中的文档之间及文档内部漫游。

■ 精确的结构化文档。该特性将允许某些高级应用,如HTML文档和其他格式文档间互相转换,以及搜索文本数据库。

由于HTML的这些特点,HTML一经推出就得到广泛的应用,并推动了Internet的发展。1991年,在连到Internet的计算机中,商业用户首次超过了学术界用户,这成为Internet发展史上的一个里程碑。

使用HTML标识的文档仅仅是一个文档,而Web浏览器则是HTML的解析器和HTMLHTMLhtml,渲染器。为了更好地表现HTML,1993年,美国超级计算机应用中心(NCSA)开始构建Web浏览器,把自己需要的特性添加到HTML中,包括直接插入图形和图表。这时的浏览器主要还是在学术界使用,显示在屏幕上的也只有一行一行的代码与数据,并没有图形用户界面。伊利诺斯州大学的学生马克·安德森改变了这种状况,发布了世界上第一个只需通过鼠标点击图形界面就可以浏览互联网的程序——Mosaic浏览器,1993年第一个面向普通用户的Mosaic 1.0发布。Mosaic的最大特色就是具有方便易用的图形界面,人们通过Mosaic,可以方便地阅读嵌有位图、照片和图表的HTML文档,并且可以自由地跳转。Mosaic是第一个被人普遍接受的浏览器,它让许多人了解了Internet,因此马克·安德森也被称为互联网浏览器之父。

1994年,当时开发Mosaic浏览器的马克·安德森和其他人联合成立Netscape(网景)公司,并在当年年底推出了Mozilla 1.0,这是当时第一款商业Web浏览器。NCSA开发的Mosaic浏览器是专门针对学术界使用的,Netscape开发的Mosaic则强调其浏览器是面向普通用户和普通带宽的,并且它不论在技术上还是在市场宣传方面都要比NCSA强大。Netscape的Mosaic(后来改名为Mozilla)浏览器提供了很多强大的浏览器新特性,并承诺其浏览器支持当时所有的主流操作系统:Windows、Macintosh和UNIX,还把当时Internet上3个主要的技术Web、Mail和News Group都集成到Mozilla浏览器中,这一切都极大地提高了Mozilla的市场占有率,同时也加快了HTML和Web的发展。1994年年底,Internet上Web应用的网络流量首次超过电信系统的流量,位居FTP网络流量之后;到1995年4月,Web应用的流量就超过了FTP,成为Internet上最主要的应用了。

刚开始Mozilla在市场上的占有率很高,几乎没有什么浏览器能和其抗衡。1995年1月,Microsoft在发布Windows 95操作系统的同时,也发布了Internet Explorer 1.0,这款Web浏览器几乎就是Mosaic的翻版,同时又是和操作系统捆绑在一起的,因此受到人们的诟病,但是也免除了用户手动安装Web浏览器的麻烦,使得更多的人得以接触Internet。从此Web浏览器市场上开始了Netscape和Microsoft两家鼎立的局面,并展开了长达十多年的竞争。在1995年夏,Netscape凭借浏览器强大的功能(框架、Java、JavaScript和插件支持),占据80%的市场,在1995年中期到1996年年末的这一段时间中,两家公司竞争更加白热化,大概每个星期都会有一个Web浏览器的版本出现,竞争的结果则是不断有新的Web浏览器版本和新的HTML特性出现。这一时期的HTML发展很快,新的HTML标记不断被浏览器引入,有一些新标记流行起来,而有一些又消失了;有些增加部分设计得很糟,很多甚至不遵从SGML规范,这使得HTML的发展出现了混乱。

2.2.2 HTML的发展

1995年11月,在瑞士日内瓦举行的第一次WWW会议上成立了一个HTML工作小组(World Wide Web Consortium's HTML Working Group)。它的主要任务是把HTML形式化成一种SGML DTD,称之为HTML Level 2(HTML 2.0,RFC1866,由蒂姆·本尼斯李最初设计的HTML被定义为Level 1)。尽管有关的各方从来没有取得完全一致的共识,但万维网联盟HTML工作组还集中了1996年万维网发展的成果,产生了HTML 3.2版本。

HTML 3.2及其以后版本继承了以前版本的所有特点,并在以下几个方面有所发展。

■ 更加明确了文档的结构和表现形式上的区别,以鼓励使用格式表(Style Sheet)来取代使用元素和属性进行表现的方式。

■ 更加优良的表单性能,加入了访问关键词(Access Key),构建对称的表单控件能力,构建对称的下拉菜单控件的能力和动态标签。

■ 在文本描述的标记中包含对象。

■ 一种新客户端的文本包括在图像映射元素(<map>)中,使得网页设计者可以集成文本和图像链接。

■ 可以将替代图像的文本包括在图像元素(<img>)中,也可以将图像映射(image map)包含到区域元素(<area>)中。

■ 在所有元素中支持title和language两个属性。

■ 更多的表格属性,包括caption、column groups和方便的非可视信息(Non-visual Reading)的表现机制。

在HTML规范以后,HTML的发展逐步走上有序发展的道路,但HTML并没有停止发展,Microsoft在1997年推出的IE 4.0中首次提出了DHTML(Dynamic HTML,动态HTML)的概念,成为近年来网络发展进程中最振奋人心也最具实用性的创新之一。在没有DHTML之前,HTML是静态的,一旦页面加载完毕,它就像一个画面,怎么看也不会发生变化,如果要改变元素只能重新编写HTML代码。DHTML改变了这种情况,Web开发人员可以编写相应的代码,在不刷新页面的情况下动态改变元素的属性,动态HTML就意味着Web页面对用户有响应,即HTML能自动变化。

为了解DHTML,我们可以先来看一看微软中国站点中的一个重要界面特性——当浏览者将鼠标指针移动到页面导航条上时,会动态地弹出一个菜单,在该菜单中移动鼠标,所指向的菜单项字体变为浅绿色显示;如果将鼠标指针移出菜单所在范围,则菜单自动隐藏;如果将鼠标指针移动到导航条上另外一个区域,则会弹出另外一个菜单(见图2-4)。

图2-4 Microsoft网站DHTML效果图

为了实现这种自动变化的动态效果,首先,DHTML需要一种方法查阅文档,跟踪页面上的每个元素,包括从最小的<H6>标题和<HR>水平标尺,到表单中所有元素。从本质上说,每当页面被加载时,浏览器就建立起一个数据库,每个标记就成为数据库中的一个记录,这个数据库就称作文档对象模型(Document Object Model, DOM),即把整个文档看作一个连续的对象模型(在下一节我们将详细讲解DOM)。其次,DHTML还需要一种方法来控制一个文档中所有需要控制的元素,这可以通过一些脚本语言来完成,例如JavaScript或VBScript,脚本元素可以精确控制页面上的各个节点,使之发生预想的变化,如在一个菜单项中对应的内容。为了表现页面上的变化,还需要用一些设置页面的属性,如字体颜色变化等,这一般由CSS来完成。因此,DHTML实际上是DOM、JavaScript和CSS的集合,它们共同组成了DHTML的全部内容。

凭借IE 4.0推出的DHTML等强大的功能,IE打败了Netscape,逐渐成为Web浏览器市场的主流,并把这种霸主地位一直保持到今天。不久W3C的HTML工作组吸收了DHTML的优点,正式承认了在Web页面中的动态效果,在代号为Cougar的HTML 4.0版本中,W3C把动态超文本的实现分为了3个部分:脚本、支持动态效果的浏览器和CSS,而支持动态效果的浏览器,则是指实现了DOM规范的Web浏览器。

时至今日,微软的IE已经成为市场占有率最高的浏览器,Netscape的市场份额逐渐缩小,Netscape在2008年3月1日正式退出浏览器舞台。但是互联网上的浏览器之战并没有结束,反而愈演愈烈,基于Netscape内核的Firefox发展迅速,不断抢占IE的市场份额,Opera、Safari等也在不断崛起;而互联网巨头Google也不失时机地在2008 年9月2日正式推出了自己的浏览器Chrome,以整合自己在互联网上的应用。因此,正如前微软首席执行官比尔·盖茨在总结IE浏览器市场份额超过Netscape时所说的那样:“这一切都将继续”。

从HTML的发展历史我们可以看出,HTML和Web浏览器的发展是相互促进的。从某种意义上来说,Web浏览器就是互联网的引擎,Web浏览器的不断发展,使HTML的表达能力更加丰富;Web浏览器提供的功能越多,HTML的表现力也就越丰富。作为例证,Netscape最先在Mozilla上提供了JavaScript、框架和插件等功能,这些功能提高了HTML页面和用户的交互性,很快IE也提供了类似的功能。而最有证明性的例子则是IE提供的XMLHttpRequest对象,也就是我们所说的Ajax功能,是IE5.0中推出的一个特性,允许用户局部刷新HTML页面,而这个特性很快得到Mozilla和Safari等Web浏览器支持,成为事实上的标准。

从HTML和Web浏览器的发展历史中我们也可以看到,Web应用从来都不是单纯的HTML开发,还要涉及Web浏览器特性的开发。Web浏览器支持的特性很多,而我们需要关注的是那些最主流的特性,如DOM、CSS、JavaScript等,这些内容将在接下来的章节中介绍。