JavaScript DOM (1)

JavaScript 简史

JavaScript 是Netscape公司与Sun公司合作开发的。在 JavaScript 1.0发布时,Netscape Navigator主宰着浏览器市场。微软在推出IE3的时候发布了自己的VBScript语言,同时以JScript为名发布了JavaScript 的一个版本,很快赶上了 Netscape 的步伐。面对微软公司的竞争,Netscape 和 Sun公司联合ECMA(欧洲计算机制造商协会)对JavaScript 语言进行了标准化,于是出现了ECMAScript语言,这是同一种语言的另一种名字。

DOM是一套对文档的内容进行抽象和概念化的方法。Netscape Navigator 4发布于1997年6月,IE4发布于同年10月。这两种浏览器都对它们的早期版本进行了许多改进,大幅扩展了DOM,使能够通过JavaScript 完成的功能大大增加。而网页设计人员也开始接触到一个新名词:DHTML(动态HTML)。

DHTML并不是一项新技术,而是描述HTML, CSS和JavaScript 技术组合的术语。不幸的是,NN 4和IE 4浏览器使用的是两种不兼容的DOM。这导致了一种可笑的局面:程序员在编写DOM脚本代码时必须知道它们将运行在哪种浏览器环境里,所以在实际工作中,许多脚本不得不编写两次,一次为Netscape Navigator,另一次为IE。同时,程序员还必须编写一些代码去探查在客户端运行的浏览器到底是哪一种。DHTML打开了一个充满机会的新世界,但想要进入其中的人们却发现这是个充满苦难的世界。因此,没多久,这种技术的评价就变成了“宣传噱头”和“难以实现”。

就在浏览器制造商以DOM为武器展开营销大战的同时,W3C结合大家的优点推出了一个标准化的DOM。令人欣慰的是,Netscape、微软和其他一些浏览器制造商们还能抛开彼此的敌意而与W3C携手制定新的标准,并于1998年10月完成了“第1级DOM”(DOM Level 1)。

W3C对DOM的定义是:“一个与系统平台和编程语言无关的接口,程序和脚本可以通过这个接口动态的访问和修改文档的内容、结构和样式。”W3C推出的标准化DOM,在独立性和适用范围等诸多方面,都远远超出了各自为战的浏览器制造商们推出的各种专有DOM。

今天几乎所有的浏览器都内置了对DOM的支持。我们已经目睹了由异步数据传输技术(Ajax)所引发的的学习DOM脚本编程的热潮,而HTML5 DOM的众多新特性,怎能不让人对Web的未来浮想联翩?

——总结   《JavaScript DOM 编程技术》(第2版)第一章

时间: 2024-10-25 03:20:41

JavaScript DOM (1)的相关文章

基础JavaScript练习(二)总结

任务目的 学习与实践JavaScript的基本语法.语言特性 练习使用JavaScript实现简单的排序算法 任务描述 基于上一任务 限制输入的数字在10-100 队列元素数量最多限制为60个,当超过60个时,添加元素时alert出提示 队列展现方式变化如图,直接用高度表示数字大小 实现一个简单的排序功能,如冒泡排序(不限制具体算法),用可视化的方法表达出来,参考见下方参考资料 任务注意事项 实现简单功能的同时,请仔细学习JavaScript基本语法.事件.DOM相关的知识 请注意代码风格的整齐

javaScript事件(三)事件对象

一.事件 二.事件流 以上内容见:javaScript事件(一)事件流 三.事件处理程序 四.IE事件处理程序 以上内容见javaScript事件(二)事件处理程序 五.事件对象 1.认识事件对象 事件在浏览器中是以对象的形式存在的,即event.触发一个事件,就会产生一个事件对象event,该对象包含着所有与事件有关的信息.包括导致事件的元素.事件的类型以及其他与特定事件相关的信息. 例如:鼠标操作产生的event中会包含鼠标位置的信息:键盘操作产生的event中会包含与按下的键有关的信息.

javaScript事件(四)event的公共成员

一.事件 二.事件流 以上内容见:javaScript事件(一)事件流 三.事件处理程序 四.IE事件处理程序 以上内容见javaScript事件(二)事件处理程序 五.事件对象 以上内容见javaScript事件(三)事件对象 六.事件对象的公共成员 1.DOM中的event的公共成员 event对象包含与创建它的特定事件有关的属性和方法.触发的事件类型不一样,可用的属性和方法不一样.但是,DOM中所有事件都有以下公共成员. 属性/方法 类型 读/写 说明 bubbles Boolean 只读

零基础JavaScript编码(二)

任务目的 在上一任务基础上继续JavaScript的体验 学习JavaScript中的if判断语法,for循环语法 学习JavaScript中的数组对象 学习如何读取.处理数据,并动态创建.修改DOM中的内容 任务描述 参考以下示例代码,页面加载后,将提供的空气质量数据数组,按照某种逻辑(比如空气质量大于60)进行过滤筛选,最后将符合条件的数据按照一定的格式要求显示在网页上 <!DOCTYPE html> <html> <head> <meta charset=&

javaScript事件(八)事件类型之变动事件

DOM2级的变动(mutation)事件能在DOM中某一部分发送变化时给出提示.变动事件为XML或HTML DOM设计的,并不特定于某种语言.DOM2级定义了如下变动事件. DOMSubtreeModifined:在DOM结构发生任何变化的时候.这个事件在其他事件触发后都会触发. DOMNodeInserted:当一个节点作为子节点被插入到另一个节点中时触发. DOMNodeRemoved:在节点从其父节点中移除时触发. DOMNodeInsertedIntoDocument:在一个节点被直接插

零基础JavaScript编码(一)

任务目的 JavaScript初体验 初步明白JavaScript的简单基本语法,如变量.函数 初步了解JavaScript的事件是什么 初步了解JavaScript中的DOM是什么 任务描述 参考以下示例代码,补充其中的JavaScript功能,完成一个JavaScript代码的编写 本任务完成的功能为:用户可以在输入框中输入任何内容,点击"确认填写"按钮后,用户输入的内容会显示在"您输入的值是"文字的右边 <!DOCTYPE html> <ht

深入理解JavaScript系列(47):对象创建模式(上篇)

介绍 本篇主要是介绍创建对象方面的模式,利用各种技巧可以极大地避免了错误或者可以编写出非常精简的代码. 模式1:命名空间(namespace) 命名空间可以减少全局命名所需的数量,避免命名冲突或过度.一般我们在进行对象层级定义的时候,经常是这样的: var app = app || {}; app.moduleA = app.moduleA || {}; app.moduleA.subModule = app.moduleA.subModule || {}; app.moduleA.subMod

深入理解JavaScript系列(20):《你真懂JavaScript吗?》答案详解

介绍 昨天发的<大叔手记(19):你真懂JavaScript吗?>里面的5个题目,有很多回答,发现强人还是很多的,很多人都全部答对了. 今天我们来对这5个题目详细分析一下,希望对大家有所帮助. 注: 问题来自大名鼎鼎的前端架构师Baranovskiy的帖子<So, you think you know JavaScript?>. 答案也是来自大名鼎鼎的JS牛人Nicholas C. Zakas的帖子<Answering Baranovskiy’s JavaScript qui

javaScript事件(二)

一.事件 二.事件流 以上内容见:javaScript事件(一) 三.事件处理程序 前面提到,事件是用户或浏览器自身执行的某种动作,如click,load和mouseover都是事件的名字.响应某个事件的函数就叫事件处理程序(也叫事件处理函数.事件句柄).事件处理程序的名字以"on"开头,因此click事件的事件处理程序就是onclick,load事件的事件处理程序就是onload. 为事件指定事件处理程序的方法主要有3种. 1.html事件处理程序 首先,这种方法已经过时了.因为动作