Text: wholeText 属性

Baseline 已广泛支持

此特性已相当成熟,可在许多设备和浏览器版本上使用。自 ⁨2015 年 7 月⁩以来,各浏览器均已提供此特性。

Text 接口的只读 wholeText 属性返回与该节点在逻辑上相邻的所有 Text 节点的全部文本。文本按照文档顺序连接。这允许指定任何文本节点并以单个字符串形式获取所有相邻的文本。

注意: 这类似于调用 Node.normalize() 然后读取文本值,但不会修改树。

一个包含连接文本的字符串。

示例

假设你的网页中有以下简单的段落

html
<p>
  Through-hiking is great!
  <strong>No insipid election coverage!</strong> However,
  <a href="https://en.wikipedia.org/wiki/Absentee_ballot">casting a ballot</a>
  is tricky.
</p>

你决定不喜欢中间的句子,所以你删除了它

js
const paragraph = document.querySelector("p"); // Reads the paragraph
paragraph.removeChild(paragraph.childNodes[1]); // Delete the strong element

现在你得到了 “长途徒步很棒!但是,投票是棘手的。”,在超链接之前有两个节点

  1. 一个包含字符串 “长途徒步很棒!”Text 节点
  2. 第二个 Text 节点包含字符串 “ 但是,”

要一次获取这两个节点,你可以调用 paragraph.childNodes[0].wholeText

js
console.log(`'${paragraph.childNodes[0].wholeText}'`); // 'Through-hiking is great!   However, '

规范

规范
DOM
# ref-for-dom-text-wholetext①

浏览器兼容性

另见

  • 它所属的 Text 接口。