2025年3月23日 星期日 甲辰(龙)年 月廿二 夜 设为首页 加入收藏
rss
您当前的位置:首页 > 计算机 > 编程开发 > JavaScript

JS nodeValue和data属性:获取指定元素包含的文本

时间:03-07来源:作者:点击数:50

JavaScript 中,使用 nodeValue 或 data 属性可以访问文本节点包含的文本。使用 length 属性可以获取包含文本的长度,利用该属性可以遍历文本节点中每个字符。

示例

设计一个读取元素包含文本的通用方法。

  • //获取指定元素包含的文本
  • //参数:e 表示指定元素
  • //返回包含的所有文本,包括子元素中包含的文本
  • function text(e) {
  • var s = "";
  • var e = e.childNodes || e; //判断元素是否包含子节点
  • for (var i = 0; i < e.length; i ++) { //遍历所有子节点
  • //通过递归遍历所有元素的子节点
  • s += e[i].nodeType != 1 ? e[i].nodeValue : text(e[i].childNodes);
  • }
  • return s;
  • }

在上面函数中,通过递归函数检索指定元素的所有子节点,然后判断每个子节点的类型,如果不是元素,则读取该节点的值,否则继续递归遍历该元素包含的所有子节点。

下面使用上面定义的通用方法读取 div 元素包含的所有文本信息。

  • <div id="div1">
  • <span class="red">div</span>
  • 元素
  • </div>
  • <script>
  • var div = document.getElementById("div1");
  • var s = text(div); //调用读取元素的文本通用方法
  • console.log(s); //返回字符串“div 元素”
  • </script>

这个通用方法不仅可以在 HTML DOM 中使用,也可以在 XML DOM 文档中工作,并兼容不同的浏览器。

方便获取更多学习、工作、生活信息请关注本站微信公众号城东书院 微信服务号城东书院 微信订阅号
推荐内容
相关内容
栏目更新
栏目热门