文本节点由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. 2019暑训第一场训练赛 |（2016-icpc区域赛）部分题解

    // 今天下午比赛自闭了,晚上补了题,把AC的部分水题整理一下,记录坑点并吸取教训. // CF补题链接:http://codeforces.com/gym/101291 A - Alphabet 题 ...

  2. Chapter 4 图

    Chapter 4 图 . 1-   图的存储结构 无向图:对称 有向图:…… 2-   图的遍历 1   深度优先搜索(DFS) 类似于二叉树的先序遍历 2   广度优先搜索(BFS) 类似于二叉树 ...

  3. ORC格式hive逻辑中case when问题

    前阵子做hive开发发现orc格式文件使用case when情况下会造成nullcount会统计入内问题,修改为sum就没此问题.具体例子下次放假回来记录,现在不在公司,这里做个mark

  4. 2018-8-10-dotnet-从入门到放弃的-500-篇文章合集

    title author date CreateTime categories dotnet 从入门到放弃的 500 篇文章合集 lindexi 2018-08-10 19:16:52 +0800 2 ...

  5. Df- Linux必学的60个命令

    1.作用 df命令用来检查文件系统的磁盘空间占用情况,使用权限是所有用户. 2.格式 df [options] 3.主要参数 -s:对每个Names参数只给出占用的数据块总数. -a:递归地显示指定目 ...

  6. 廖雪峰Java11多线程编程-1线程的概念-1多线程简介

    多任务 现代操作系统(windows,MacOS,Linux)都可以执行多任务: 多任务就是同时运行多个任务,例如同时开启钉钉.百度网盘.火狐.谷歌.ps等 操作系统执行多任务就是让多个任务交替执行, ...

  7. Django项目：CRM(客户关系管理系统)--67--57PerfectCRM实现admin批量生成上课记录

    #admin.py # ————————01PerfectCRM基本配置ADMIN———————— from django.contrib import admin # Register your m ...

  8. centos7如何配置yum仓库

    centos7如何配置yum仓库 一.总结 一句话总结: 备份原仓库配置原件,接来下按需求 百度 是指定本地光盘作为yum仓库,还是使用网络源作为yum仓库 二.centos7如何配置yum仓库 1. ...

  9. IDEA快速定位错误快捷键

  10. 一、WebService基础概念

    一.Web Service简介 1.1.Web Service基本概念 Web Service也叫XML Web Service WebService是一种可以接收从Internet或者Intrane ...