文本节点由TEXT类型表示,包含纯文本内容,Text节点具有以下特征:

看看下面的代码:

div元素开始和结束标签只要存在内容,就会创建一个文本节点。可以使用以下代码来访问元素的这些文本子节点:

访问元素的文本节点的代码

但是这里有几个小问题:

 <body>
<div></div>
<script>
var div = document.getElementsByTagName('div')[0];//这里没有这句,只是单独使用div会导致异常1
var textNode = div.firstChild || div.childNodes[0];
alert(textNode);//这里div标签没有文本节点的话会导致异常2,同时无法设置nodeValue属性
textNode.nodeValue = 'some <strong> other </strong> message';
</script>

因此,只有这个文本 节点存在于当前的文档树中,那么修改文本节点的结果才会有反映。

输出:

 <div id="myDiv"> </div>
<script>
var parent = document.getElementById('myDiv');
var div = document.createElement('p');
div.className = 'test';
var text = document.createTextNode('<strong> Hello World </strong>')
div.appendChild(text);
parent.parentNode.insertBefore(div,parent);//此处是使用parent.parentNode来代表div的父节点,换句话说不必获取父元素

输出:

第十章—DOM(三)——Text类型的更多相关文章

  1. javascript之DOM(三Element类型)

    Element类型用于表现XML和HTML的元素,提供了对元素标签名.子节点及特性的访问. 要访问标签名可以使用nodeName和tagName属性,其返回值是一样的. <p id=" ...

  2. 第十章—DOM(0)—NODE类型

    DOM1定义了一个node接口,该接口由DOM的所有节点类型实现. 所有的节点都存在这样或那样的关系.在HTML中,head,body可以看出是html的子元素,html是head,body的父元素, ...

  3. 第十章—DOM(一)——Document类型

    DOCUMENT类型 JS通过document类型表示文档,在文档中document对象是HTMLDocument的一个实例,表示整个HTML页面.document对象是window对象的一个属性,因 ...

  4. 从原型链看DOM--Text类型

    文本节点由Text类型表示,包含的是可以按照字面解释的纯文本内容,纯文本中可以包含转义后的HTML字符但不能包含HTML代码.原型链继承关系为:textNode.__proto__->Text. ...

  5. JavaScript中DOM节点层次Text类型

    文本节点 标签之间只要有一点内容都会有文本节点,包括空格 创建文本节点document.createTextNode() 可以使用 document.createTextNode 创建新文本节点 == ...

  6. JavaScript高级程序设计学习笔记第十章--DOM

    1.DOM:文档对象模型,是针对 HTML 和 XML 文档的一个 API(应用程序编程接口). 2.DOM 可以将任何 HTML 或 XML 文档描绘成一个由多层节点构成的结构. 3.文档节点是每个 ...

  7. javascript之DOM(四其他类型)

    一.Text类型 文本节点由Text类型表示,指的是可以以字面意思解释的纯文本内容,其中包含HTML代码. nodeType=3 nodeName=#text nodeValue=文本内容 paren ...

  8. mysql中char,varchar与text类型的区别和选用

    关于char,varchar与text平时没有太在意,一般来说,可能现在大家都是用varchar.但是当要存储的内容比较大时,究竟是选择varchar还是text呢?不知道...... 于是去查阅了一 ...

  9. javascript系列之DOM(三)---事件

    原文:javascript系列之DOM(三)---事件 事件是javascript跳动的心脏,是DOM所有成分结合的万金油.当我们在WEB 上进行某些交互时,事件也就发生了.点击某些内容,鼠标经过特定 ...

随机推荐

  1. 群晖系统下btfs(占用5%)和ext4文件格式的硬盘占用和选择

    1个人感觉选择ext4就可以,毕竟重要数据会设置raid1 不重要的数据也不需要快照什么的 商用除外 对于一个4t的硬盘 实际容量3726G 使用ext4可用空间3666G,群晖 占用60G大概1.6 ...

  2. BeanUtils工具类copyProperties方法缺点及解决

    使用类为spring-beans:4.3.13release包中的 org.springframework.beans.BeanUtils BeanUtils.copyProperties(Objec ...

  3. StringBuffer清空

    转载自:http://blog.sina.com.cn/s/blog_56fd58ab0100qfcz.html 在开发程序的时候,经常使用StringBuffer来进行字符串的拼接.如果在循环中来反 ...

  4. SPRINGBOOT配置事物注解和@MAPPER注意

    MAPPER接口要使用@Mapper注解,不能用@Compent @Repository,否则没有效果 一.开启事物 在启动类上加 @EnableTransactionManagement //如果m ...

  5. HZOI20190902模拟35题解

    题面: A:公园 DAG上想拓扑dp 然而博主记忆化搜索了一下 设f[i][j]表示从i节点走j个点出公园所用的最小时间 则$f[u][i]=min(f[v][j-1]+dis_{u,v})$; 然后 ...

  6. dubbo入门学习(四)-----dubbo配置

    配置来源 首先,从Dubbo支持的配置来源说起,默认有四种配置来源: JVM System Properties,-D参数 Externalized Configuration,外部化配置 Servi ...

  7. 转:Linux fork与vfork的深入分析

    源地址:http://linux.chinaitlab.com/c/831529.html 一)fork的概述 .操作系统对进程的管理,是通过进程表完成的.进程表中的每一个表项,记录的是当前操作系统中 ...

  8. Spring AOP(一)--基本概念

    AOP(Aspect Oriented Programing),意为面向切面编程,其实看了很多书本的介绍和说明,我觉得这些解释都太过书面,也可能是翻译的原因,总觉得还是不太懂,也难以理解这种叫法,尤其 ...

  9. 视频透雾原理加视频增强Retinex算法介绍

    (本文转自:http://www.syphong.cn/52-1.html#) 视频透雾原理加视频增强Retinex算法介绍 -上海凯视力成 钟建军 一. 视频增强的背景 视觉信息是人类获得外界信息的 ...

  10. HashMap基础知识

    HashMap 简介 HashMap 主要用来存放键值对,它基于哈希表的Map接口实现,是常用的Java集合之一. JDK1.8 之前 HashMap 由 数组+链表 组成的,数组是 HashMap ...