文本节点由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. 学而有道--思维导图式总结(一):Nosql分类

    前言: 众所周知,学习是需要方法的.作为一名java程序员,我们需要学习无数的技能,然而我们的大脑并不买账,学习了一项知识,时间一久就会遗忘, 如何更好高效的回忆起曾经学习过的知识,是极其重要的. 有 ...

  2. python3-常用模块之time

    import time time模块主要是处理各种类型的时间 常用方法 1.time.sleep(secs) (线程)推迟指定的时间运行,单位为秒. 2.time.time() 获取当前时间戳 时间戳 ...

  3. jquery移除元素某个属性

    removeAttr() 方法从被选元素中移除属性. 例如:$("p").removeAttr("style");

  4. mac使用ssh出现permission denied(publickey)

    看出错信息是权限太开放的问题,google了一下,修改权限,不只是需要修改 .pem 文件的权限,还需要修改.ssh目录和用户目录 chmod go-w ~/ chmod ~/.ssh chmod ~ ...

  5. VS2005进行WORD文档开发

    折腾了将近一个月的WORD文档开发终于告一段落.这件事已经很多大牛已经做过了.并且很多方法都已经非常详细,提供的资料也非常齐全.不过由于时间的久远并且较为散乱.所以我在学习时间过程中还是走了一些些弯路 ...

  6. elasticsearch filters特性

    使用filters优化查询 ElasticSearch支持多种不同类型的查询方式,这一点大家应该都已熟知.但是在选择哪个文档应该匹配成功,哪个文档应该呈现给用户这一需求上,查询并不是唯一的选择.Ela ...

  7. urllib与urllib2的学习总结

    先啰嗦一句,我使用的版本是python2.7,没有使用3.X的原因是我觉得2.7的扩展比较多,且较之前的版本变化不大,使用顺手.3.X简直就是革命性的变化,用的蹩手.3.x的版本urllib与urll ...

  8. 为互联网业务而生:阿里云全球首发云Cassandra服务!

    引言:十年沉淀.全球宽表排名第一.阿里云首发云Cassandra服务 ApsaraDB for Cassandra是基于开源Apache Cassandra,融合阿里云数据库DBaaS能力的分布式No ...

  9. day26 作业

    目录 TCP三次握手.四次挥手图 三次握手 四次挥手 简明理解三次握手 基于TCP开发一款远程CMD程序 TCP三次握手.四次挥手图 三次握手 第一次握手:客户端给服务端发一个 SYN 报文,并指明客 ...

  10. yolo-windows检测高分辨率图像及封装应用

    YOLO训练自己的数据集的一些心得 封装yolo-windows为动态链接库 yolo-windows源码 项目开源代码:LargeImageDetect-yolo-windows 由于项目需要,需要 ...