DOM变化

我们知道DOM有许多的版本,其中DOM0和DOM2这两个级别以对事件的纳入标准而为人所知

但是呢,这里不讲事件,在后面会有专门和事件有关的部分作为详细讲解

这里就只讲一下DOM2和DOM3的背景来历

首先DOM1级主要定义的是HTML和XML文档底层的结构,DOM2和DOM3两个级别则主要致力于为文档引入更加丰富的交互能力

与此同时这两个版本也支持了更加高级的XML特性

首先DOM2分为了许多模块

如下所示:

1. DOM2级核心

2.DOM2级视图

3.DOM2级事件

4.DOM2级样式

5.DOM2级遍历和范围

6.DOM2级HTML

以上板块的内容在致力于拓展DOM API的同时也提供了更好的错误处理及特性检测的能力

这一目的在一定程度上意味着对命名空间的支持

而通过命名空间我们则可以在同一文档中混入不同的文档类型的代码

总的来说

DOM2没有引入新的类型而是在已有类型的基础上添加新的方法以增强现有类型的能力

而DOM3既增强了已有类型的能力,也引入了新的类型

下面我们来看看这些变化

Node类型的变化

在DOM2级中,Node类型包含以下特定于命名空间的属性

localName:不带命名空间前缀的节点名称

namespaceURI:命名空间的URI或者null(未指定的情况下)

prefix:命名空间前缀或者null(未指定的情况下)

PS.当节点使用了命名空间的时候,Node的 nodeName 则等于 prefix : localname

nodeName则相当于 tagName

以 <s:svg> 为例:nodeName为 s:svg  prefix为s localName为svg

在此基础上DOM3级则更进一步,引入了如下与命名空间有关的方法:

isDefaultNamespace(nameSpaceURI): 判断指定的URI是否为当前节点的默认命名空间

lookupNamespaceURI(prefix):返回给定前缀的命名空间

lookupPrefix(namespaceURI):返回给定namespaceURI的前缀

Document类型的变化

DOM2中 Document 类型包含了下列与命名空间有关的方法:

createElementNS(namespaceURI,tagName):创建属于namespaceURI命名空间的指定元素

createAttributeNS(namespaceURI,attributeName):创建属于namespaceURI命名空间的新特性

getElementsByTagNameNS(namespaceURI,tagname):返回属于指定命名空间的nodeList集合

只有当一个文档中存在多个命名空间时,以上方法才是必要的

Element类型的变化

新增操作特定命名空间特性的API

新增方法如下:

getAttributeNS(namespaceURI,localName):获取指定命名空间的指定特性

getAttributeNodeNS(namespaceURI,localName):取得指定命名空间的指定特性节点

hasAttributeNS(namespaceURI,localName):判断当前元素是否拥有属于指定命名空间的指定特性

removeAttributeNS(namespaceURI,localName):移除指定命名空间的指定特性

setAttributeNS(namespaceURI,localName,value):将指定命名空间的指定特性的值设置为value

setAttributeNodeNS(namespaceURI,attrnode):设置指定命名空间的指定特性节点为attrnode

NamedNodeMap类型的变化

同样的针对于特性节点的NamedNodeMap类型也提供了与命名空间相关的方法

getNamedItemNS(namespaceURI,localName):取得指定空间名为localName的项

removeNamedItemNS(namespaceURI,localName):移除指定空间名为localName的项

setNamedItemNS(node):添加已经事先设置命名空间的node

其它方面的变化

除了上述与命名空间相关的变化之外

DOM2、3还有以下变化:

1.DocumentType新增了三个属性:publicId、systemId、internalSubset  用于访问文档信息声明

2.importNode(要复制的节点,是否深拷贝):从一个文档中获取节点并导入另一个文档

3.document.implementation 添加了两个方法 createDocumentType、createDocument 用于创建文档以及创建文档类型声明

4.对Node添加 isSupported()方法,用于判断node是否实现了某一特性

5.isSameNode(node) 判断当前节点是否与Node相同

6.isEqualNode(node)判断当前节点是否与Node相等

7.setUserData(要设置的键,设置的值,处理函数)用于给DOM节点添加额外的数据属性

第三个参数的处理函数接收五个参数:操作类型的数值、数据键、数据值、源节点、目标节点   而这个处理函数将会在DOM节点被clone时调用,若不在处理函数中进行处理,那么克隆节点将不会复制节点数据

8.frame.contentDocument  指向表示框架内容的文档对象(该属性受同源策略的限制)

Javascript高级编程学习笔记(49)—— DOM2和DOM3(1)DOM变化的更多相关文章

  1. Javascript高级编程学习笔记(1)—— JS简介

    此系列文章,用于记录所学,如有错误欢迎指出. Javascript组成 1.核心(ECMAScript) 2.文档对象模型(DOM) 3.浏览器对象模型(BOM) 1.核心(ECMAScript) E ...

  2. Javascript高级编程学习笔记(58)—— 事件(2)事件处理程序

    事件处理程序 事件处理程序即响应某个事件的函数 事件处理程序以 “on” 开头 如“onclick”,“onload” HTML事件处理程序 某个元素支持的每种事件都可以使用一个与响应的事件处理程序同 ...

  3. 《JavaScript高级程序设计》笔记:DOM2和DOM3(十二)

    DOM1级主要定义的是HTML和XML文档的底层结构.DOM2级和DOM3级在这个结构基础上引入了更多的交互能力,也支持更高级的XML特性.为此DOM2级和DOM3级分为了很多的模块(模块直接具有某种 ...

  4. Javascript高级编程学习笔记(53)—— DOM2和DOM3(5)遍历

    遍历 “DOM2级遍历和范围” 定义了两个用于辅助完成顺序遍历的DOM结构类型 NodeIterator 和 TreeWalk 上述两种类型可以基于给定起点的DOM结构执行深度优先的遍历操作 对于检测 ...

  5. Javascript高级编程学习笔记(54)—— DOM2和DOM3(6)范围选择

    范围 为了让开发人员更加方便地控制页面“DOM2级遍历和范围”模块定义了“范围”接口 通过该接口开发人员可以选择文档中的一个区域,而不必考虑元素的界限 在常规操作不能有效地修改文档时,使用范围往往可以 ...

  6. Javascript高级编程学习笔记(52)—— DOM2和DOM3(4)元素大小

    在日常实践中,我们在使用JS的时候难免会需要获取元素的大小及位置 首先要声明的是,这一部分的内容并不属于DOM2样式规范,因为DOM中并没有对我们如何获取元素大小的相关信息做出规范 偏移量 偏移量及元 ...

  7. Javascript高级编程学习笔记(50)—— DOM2和DOM3(2)样式

    样式 在HTML中定义元素的方式有以下三种: 1.link标签引入外部样式表 2.style标签定义嵌入样式 3.通过JS中对style特性定义元素样式(行内样式) “DOM2级样式”围绕上述样式机制 ...

  8. Javascript高级编程学习笔记(56)—— DOM2和DOM3(8)低版本IE范围

    虽然IE9支持了DOM范围,但是IE8及更早版本并不支持DOM范围 所以IE8以下的更早版本的IE提出了与之类似的概念以供大家使用 也就是 文本范围 var range = document.body ...

  9. Javascript高级编程学习笔记(55)—— DOM2和DOM3(7)操作范围

    操作范围中的内容 在创建范围时,内部会为这个范围创建一个文档片段 范围所属的全部节点都会被添加到这个片段中 虽然选取范围可以不是完整的.良好的DOM结构 但是在这个为范围创建的文档片段中,会自己完缺少 ...

随机推荐

  1. server 打开失败

    server:An unexpected exception was thrown. 当server服务器遇到这样遇到不能料想的错误导致打开失败的情况下,我们可以找到一个com.genuitec.ec ...

  2. 分布式之redis

    正文 1.为什么使用redis 分析:博主觉得在项目中使用redis,主要是从两个角度去考虑:性能和并发.当然,redis还具备可以做分布式锁等其他功能,但是如果只是为了分布式锁这些其他功能,完全还有 ...

  3. elementUI中表格中表单的验证

    表格中的表单验证,就是在将表格放在表单中,将表格绑定的数据也放在表单中. 最重要的是要给表格中需要验证的字段动态添加prop,再给其绑定规则. <el-form :model="tab ...

  4. GUI学习之三——QObject学习总结

    鉴于PyQt控件的继承关系,我们先学习PyQt控件的基类——QObject.  一.所有的QT对象的基类 我们先看一下PyQt里空间的继承关系,稍微改一下代码,显示出继承关系 from PyQt5.Q ...

  5. Finance财务软件(科目标签专题)

    为了满足不同业务需求,对凭证中增加一些扩展内容,我们采用自定义科目标签的形式. 怎样自定义标签? 1. 增加科目掩码 这里的代码需要与模板表中tagLabel对应 这里的名称中对应掩码值,为16位整型 ...

  6. 较大的互联网公司对Java的要求(转)

    现在各大互联网公司,对Java类的校招要求越来越高,导致很多小伙伴都很迷茫,今天分享一篇谢照东关于Java学习进阶之路,希望能帮助到一些人 佛说五蕴六毒是妄,将因果都念作业障 把看过的书罗列一下 &l ...

  7. numpy.convolve函数用法

    函数numpy.convolve(a, v, mode=‘full’),这是numpy函数中的卷积函数库 参数: a:(N,)输入的一维数组 b:(M,)输入的第二个一维数组 mode:{‘full’ ...

  8. "车羊门问题"作业

    作业完成人: 学号:20171301008 潘松泉: 学号:20171301022 陈霖彬: 1.按照你的第一感觉回答,你觉得不换选择能有更高的几率获得汽车,还是换选择能有更高的几率获得汽车?或几率没 ...

  9. 别人的Linux私房菜(15)磁盘配额与高级文件系统管理

    磁盘配额在网站.邮件.文件等服务器常见,主要有针对用户.用户组.限制某一目录的的最大磁盘配额. ext文件系统进能针对整个文件系统配额,xfs可以针对目录配额.配额和文件系统有关. 内核必须支持磁盘配 ...

  10. linux nfs远程挂载和卸载

    一.nfs远程挂载 1.首先确定服务端(实体挂载节点)的IP 2.通过cat  /etc/hosts 查看服务端的server name 3.mount -t nfs servername:/挂载文件 ...