Node的textContent属性

有时需要查询纯文本形式的元素内容，或者在文档中插入纯文本。标准的方法是用Node的textContent属性来实现：

var para=document.getElementsByTagName("p")[0];

//文档中第一个＜p＞

var text=para.textContent;

//文本是"This is a simple document."

para.textContent="Hello World!";

//修改段落内容

textContent属性在除了IE的所有当前的浏览器中都支持。在IE中，可以用Element的innerText属性来代替。

下面简单实现一个textContent()函数，它递归地遍历元素的子节点，然后连接后代节点中所有的Text节点的文本。为了理解代码，回想一下nodeValue属性（定义在Node类型中），它保存Text节点的内容。

//返回元素e的纯文本内容，递归进入其子元素

//该方法的效果类似于textContent属性

function textContent(e){

var child,type,s="";//s保存所有子节点的文本

for(child=e.firstChild;child!=null;child=child.nextSibling){

type=child.nodeType;

if(type===3){//Text节点

s+=child.nodeValue;

} else if (type===1){//递归Element节点

s+=textContent(child);

}

return s;

}

textContent属性就是将指定元素的所有后代Text节点简单地串联在一起。

Node的textContent属性相关推荐

【EASYDOM系列教程】之 textContent 属性
Node 对象提供了 textContent 属性实现获取或设置 HTML 页面中指定元素的文本内容. 获取文本内容 textContent 属性表示 HTML 页面指定节点及其后代节点的文本内容.其 ...
node.js 静态属性_如何使用静态站点和Node.js开发和部署第一个全栈式Web应用程序
node.js 静态属性 This tutorial will show you how to convert a static website that uses HTML, CSS and Jav ...
JS 之Node节点的属性、方法获取
JS Node节点的常见属性和方法使用 & 如何获取相应节点和值一.节点的常用属性和方法 (一)通过具体的元素节点调用如下方法和属性 <1>getElementsByTagNam ...
element 往node里面增加属性值_【Vue原理】Compile - 源码版之 Parse 属性解析
写文章不容易,点个赞呗兄弟专注 Vue 源码分享,文章分为白话版和源码版,白话版助于理解工作原理,源码版助于了解内部详情,让我们一起学习吧研究基于 Vue版本 [2.5.17] 如果你觉得排版难 ...
element 往node里面增加属性值_HashMap加载因子为何0.75，为何初始化值2的指数幂，底层解析...
01 前言我们在声名HashMap的时候,一般都会这样写. public class MapTest { public static void main(String[] args) { HashM ...
15、DOM常见的操作方式
DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口),描绘了一个层次化的节点树. 15.1 创建DOM节点常用的节点类型有如下几种:元素节点.属性节点.文本节点.注释节点 ...
【收藏】JavaScript DOM操作简易速查手册
附Java/C/C++/机器学习/算法与数据结构/前端/安卓/Python/程序员必读书籍书单大全: 书单导航页(点击右侧极客侠栈即可打开个人博客):极客侠栈 ①[Java]学习之路吐血整理技术书 ...
JavaScript之DOM对象（Node结点属性、导航属性、页面查找）
文章目录 DOM与Node节点自身属性导航属性页面查找 DOM与Node节点 1.DOM的概念 DOM 是 W3C(万维网联盟)的标准,DOM 定义了访问 HTML 和 XML 文档的标准. W ...
Document，Node，Element，HTMLDocument ，HTMLCollection，HTMLElement，NodeList
这个问题如果不是基于原生js写组件,可能仍然不明不白,既然遇到了,就整理一下. 一.Document,Node,Element的关系 1,Document 对象 Document 对象是一棵文档树的根 ...

Node的textContent属性

Node的textContent属性相关推荐

最新文章

热门文章