Text 类型 – 学习画板

首页 » DOM » Text 类型

Text 类型

文本节点由Text类型表示,包含的是可以照字面解释的纯文本内容。纯文本中可以包含转义后的HTML字符,但不能包含HTML代码。Text节点具有以下特征:

  • nodeType的值为3;
  • nodeName的值为“#text”;
  • nodeValue的值为节点所包含的文本;
  • parentNode是一个Element;
  • 不支持(没有)子节点。

可以通过nodeValue属性或data属性访问Text节点中包含的文本,这两个属性中包含的值相同。对nodeValue的修改也会通过date反映出来,反之亦然。使用下列方法可以操作节点中的文本:

  • appendData(text):将text添加到节点的末尾;
  • deleteData(offset, count):从offset指定的位置开始删除count个字符;
  • insertData(offset, text):从offset指定的位置插入text;
  • replaceData(offset, text):用text替换从offset指定的位置开始到offset+count为止处的文本;
  • splitText(offset):从offset指定的位置将当前文本节点分成两个文本节点;
  • substringData(offset, count)提取从offset指定的位置开始到offset+count为止处的字符串。

除了这些方法之外,文本节点还有一个length属性,保存着节点中字符的数目。而且,nodeValue.length和data.length中也保存着同样的值。

在默认情况下,每个可以包含内容的元素最多只能有一个文本节点,而且必须确实有内容存在。来看几个例子:

<!--没有内容也就没有文本节点-->
<div></div>
<!--有空格,因而有一个文本节点-->
<div> </div>
<!--有内容因而有一个文本节点-->
<div>Hello world!</div>
可以使用以下代码来访问这些文本节点:
var textNode = div.firstChild;

在取得了文本节点的引用后,就可以向下面这样来引用它了:

div.firstChild.nodeValue = "Some other message";

如果这个文本节点当前存在于文档树中,那么修改文本节点的结果就会立即得到反映。另外,在修改文本节点时还要注意,此时的字符串会讲过HTML编码。换句话说,小于号、大于号或引号都会像下面的例子一样被转义:

//输出的结果是“some &lt;strong&gt;other&lt;/strong&gt; message”
div.firstChild.nodeValue = "Some <strong>other</strong> message";

应该说,这是在向DOM文档中插入文本之前,先对其进行HTML编码的一种有效方式。
在所有浏览器中都可以通过脚本访问Text类型的构造函数和原型,包括IE8及更高版本。

此文章发表在 DOM. 将 固定链接 加入收藏.