JavaScript高程第十章:DOM(中)

suosuopuo 发布于2019-08-22 10:40 / 972人阅读

摘要：主要介绍不常用的类型这里介绍我们的其他类型包括以下几个类型类型类型类型类型类型类型类型文本节点由类型表示特征值为为为节点包含的文本是一个不支持没有子节点我们可以通过访问节点包含的文本方法将添加到节点末尾从指定位置开始删除个字符从指定

主要介绍不常用的DOM类型

这里介绍我们的其他类型,包括以下几个类型:

Text类型

Comment类型

CDATASection类型

DocumentType类型

DocumentFragment类型

Attr类型

Text类型

文本节点由Text类型表示

特征

nodeType值为3

nodeName为"#text"

nodeValue为节点包含的文本

parentNode是一个Element

不支持(没有)子节点

我们可以通过nodeValue/data访问Text节点包含的文本.

方法

appendData(text)将text添加到节点末尾

deleteData(offset,count)从offset指定位置开始删除count个字符

insertData(offset,text)从offset指定位置插入text

replaceData(offset,count,text)用text替换从offset指定的位置开始到offset+count为止处的文本

splitText(offset)从offset指定的位置将当前文本节点分成两个文本节点

substringData(offset,count)提取从offset指定位置开始到offset+count为止的字符串
除此之外,哈有length属性,保存着节点中字符的数目.且值与nodeValue.length和data.length相同.

注意事项

修改时字符串会经过HTML/XML编码,所以对于小于号,大于号和引号我们要进行转义

创建文本节点

document.createTextNode()接受一个参数,就是插入节点的文本,然后将会根据HTML/XML的格式进行编码.并且在创建时也会为其设置ownerDocument属性.当然我们要将它添加进文档树中还是需要之前介绍过的操作的.

规范化文本节点

normalize()这个方法,在一个包含多个文本节点的父元素上调用该方法,会将所有文本节点合并成一个节点.
注意!(IE6):该方法会导致崩溃

分割文本节点

Text类型提供了splitText方法就是和规范化文本节点相反的一个方法,这个方法我们在之前有介绍到,这是从文本节点提取数据的常用DOM解析技术

Comment类型

这就是注释了,在DOM中通过Comment类型来表示我们的注释.

特征

nodeType值为8

nodeName值为"#comment"

nodeValue值为注释的内容

parentNode可能是Document或Element

不支持(没有)子节点

值得注意的是Comment类型和Text类型继承自相同的基类,所有在方法上除了splitText()外所有字符串操作方法都与Text类型相似.

创建

document.createComment(text)这个也与文本节点类似,而我们也很少访问这类节点,所以这里不再赘述

CDATASection类型

只针对XML文档,表示的是CDATA区域,这与Comment类似,并且该类型继承自Text类型,因此除了splitText()方法之外所有字符串操作方法都相似

特征

nodeType值为4

nodeName值为"#cdata-section"

nodeValue为CDATA区域中的内容

parentNode可能是Document或Element

不支持(没有)子节点

创建

document.createCDataSection()可以创建CDATA区域,传入参数为传入节点的内容.

DocumentType类型

这在Web浏览器中并不常用

特征

nodeType值为10

nodeName值为doctype名称

nodeValue值为null

parentNode是Document

不支持(没有)子节点

在DOM 1级中,DocumentType对象不能动态创建,只能通过解析文档代码方式创建.支持它的浏览器会把DocumentType对象保存在document.doctype中.并且描述了DocumentType对象的3个属性:name,entities和notations.

name 表示文档类型名称

entities 即文档类型描述的尸体的NamedNodeMap对象

notations 是由文档类型描述的符号的NamedNodeMap对象
通常来说只有name是有用的,它保存了

DocumentFragment类型

在所有节点类型中,只有该类型在文档中没有对应的标记.DOM规定文档片段是一种"轻量级"的文档,可以包含和控制节点,但不会和完整的文档那样占用额外资源.

特征

nodeType 值为11

nodeName 值为"#document-fragment"

nodeValue 为null

parentNode为null

子节点可以是Element,ProcessingInstruction,Comment,Text,CDATASection,EntityReference

它可以说是一个文档节点的仓库

创建

document.createDocumentFragment()方法创建文档片段,它继承了Node所有的方法,我们可以通过之前所说的方法添加节点到文档片段中,再通过方法将文档片段添加到文档中,但是这过程中发生的并不是将文档片段添加到文档树.
文档片段本身永远不会成为文档树的一部分,实际上指挥将其所有子节点添加(转移)到相应位置.

Attr类型

元素特性在DOM中以Attr类型表示,在所有浏览器中我们都可以访问Attr类型的构造函数和原型.可以说特性就是存在于元素的attributes属性中的节点.

特征

nodeType值为2

nodeName为特性名

nodeValue为特性值

parentNode值为null

HTML中不支持(没有)子节点

XML中子节点可以是Text或EntityReference
尽管我们称它为节点,但是特性并不被认为是DOM文档树的一部分.

属性

name

value

specified
这些在我们之前的章节也有所介绍,不再赘述

创建

document.createAttribute(name)可以创建相应的特性,传入参数为特性名

云服务器 GPU云服务器第十章 javascript dom javascript dom 编程艺术 javascript遍历dom

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/91031.html

JavaScript高程第十章:DOM(上)

摘要：类型除了该死的其他所有浏览器都可以访问到类型而中所有节点类型都继承自类型因此所有节点类型都共享着相同的基本属性和方法每个节点都有一个属性可以表明节点的类型我们来看看有哪些类型吧和属性则完全取决于对于元素节点保存的始终为标签名而保存的值始终为 Node类型除了IE(该死的IE),其他所有浏览器都可以访问到Node类型,而JS中所有节点类型都继承自Node类型,因此所有节点类型都共享着相...

xcold 2019-08-22 10:40 评论0 收藏0
高程3总结#第1章JavaScript简介

摘要：简介简史诞生于年，当时主要负责表单的输入验证。实现一个完整的由三部分组成核心文档对象模型浏览器对象模型就是对实现该标准规定的各个方面内容的语言的描述。把整个页面映射为一个多层节点结构。由万维网联盟规划。主要目标是映射文档的结构。 JavaScript简介 JavaScript简史 JavaScript诞生于1995年，当时主要负责表单的输入验证。如果没有表单验证的功能，填入信息之...

betacat 2019-08-23 11:43 评论0 收藏0
Event Handler 事件处理程序 1 ---《高程3》

摘要：为属性赋值匿名函数事件作用域使用级方法指定的事件处理程序被认为是元素的方法。最后这个布尔值参数如果是，表示在捕获阶段调用事件处理程序如果是，表示在冒泡阶段调用事件处理程序。事件捕获和事件冒泡 DOM2级事件规定的事件流包括三个阶段：事件捕获、处于目标阶段和事件冒泡。首先发生的是事件捕获，从外部节点到内部节点依次遍历，为截获事件提供了机会。然后是实际的目标接收到事件。最后一个阶段是冒泡...

WalkerXu 2019-08-20 11:31 评论0 收藏0
Event Handler 事件处理程序 1 ---《高程3》

摘要：为属性赋值匿名函数事件作用域使用级方法指定的事件处理程序被认为是元素的方法。最后这个布尔值参数如果是，表示在捕获阶段调用事件处理程序如果是，表示在冒泡阶段调用事件处理程序。事件捕获和事件冒泡 DOM2级事件规定的事件流包括三个阶段：事件捕获、处于目标阶段和事件冒泡。首先发生的是事件捕获，从外部节点到内部节点依次遍历，为截获事件提供了机会。然后是实际的目标接收到事件。最后一个阶段是冒泡...

wujl596 2019-08-01 15:47 评论0 收藏0
高程3总结#第18章JavaScript与XML

摘要：在基于使用命名空间的文档求值时，需要使用对象。第四个参数的取值类型是下列常量之一，返回与表达式匹配的数据类型。，返回字符串值。这是最常用的结果类型。集合中节点的次序与它们在文档中的次序一致。 JavaScript与XML 浏览器对XML DOM的支持 DOM2级核心在通过JavaScript处理XML时，通常只使用参数root，因为这个参数指定的是XML DOM文档元素的标签名 v...

gaosboy 2019-08-23 12:09 评论0 收藏0