Question

我有一个DOM元素，它有一些子文件，由文本字符串交错。我想获取每个文本字符串，并使用正则表达式替换它们。例如：

<div>Text started.
<a>Link child inside</a>
Some more text. 
<u>Another child</u>
Closing text.</div>

在这个例子中，我想提取字符串＆＃34; Text started。＆＃34;，＆＃34;更多文本。＆＃34;和＆＃34;关闭文本。＆＃34; ，以便我以后可以用其他东西替换它们。

解决方案应该是通用的，因为父级内部的子级数可能会有所不同，节点类型也会不同。

任何人都有一个聪明的答案，可以使用javascript轻松实现这一目标吗？

Answer 1

您可以使用childNodes检查nodeType是否为文本节点。在forEach内执行此操作，您可以轻松地将文本替换为您想要的任何内容。

示例：

＆＃13;

var div = document.getElementsByTagName('div').item(0);

[].slice.call(div.childNodes).forEach(function(node , i) {
  if(node.nodeType === 3) {
    var currNode = div.childNodes[i];
    var currText = div.childNodes[i].textContent;
    currNode.textContent = currText.replace(/text/i, ' Foo');
  }
})

＆＃13;

<div>
  Text started.
  <a>Link child inside</a>
  Some more text. 
  <u>Another child</u>
  Closing text.
</div>

＆＃13;

Answer 2

您可以执行以下操作;

＆＃13;

var textNodes = [...test.childNodes].filter(child => child.nodeType === Node.TEXT_NODE)
textNodes.forEach(tn => console.log(tn.textContent))

＆＃13;

<div id="test">Text started.
<a>Link child inside</a>
Some more text. 
<u>Another child</u>
Closing text.</div>

＆＃13;

使用Javascript获取其子元素之外的DOM元素的所有文本内容

2 个答案: