[GPT] 对于一个复杂的html文档而言，如何用 js 批量替换页面上的某些文字从A替换为B，前提是不能去掉标签和已绑定的事件

 

原生：示例代码

function replaceTextInDocument(node) {
  if (node.nodeType === Node.TEXT_NODE) {
    node.textContent = node.textContent.replace(/A/g, 'B');
  } else if (node.nodeType === Node.ELEMENT_NODE) {
    for (var i = 0; i < node.childNodes.length; i++) {
      replaceTextInDocument(node.childNodes[i]);
    }
  }
}

replaceTextInDocument(document.body);

上述代码定义了一个 replaceTextInDocument 函数，它接收一个节点作为参数。

如果节点是文本节点，则使用正则表达式替换文本内容。

如果节点是元素节点，则递归遍历其所有子节点，并对每个子节点调用 replaceTextInDocument 函数。

最后，我们可以调用 replaceTextInDocument 函数并将 document.body 作为参数，以替换整个页面上的文本内容。

这样就可以批量替换 HTML 页面中的某些文字，而不会影响标签和已绑定的事件。

 

jQuery实现：示例代码

function replaceTextInDocument($element) {
  $element.contents().each(function() {
    if (this.nodeType === Node.TEXT_NODE) {
      this.nodeValue = this.nodeValue.replace(/A/g, 'B');
    } else if (this.nodeType === Node.ELEMENT_NODE) {
      replaceTextInDocument($(this));
    }
  });
}

replaceTextInDocument($('#myContainer'));

在上面的代码中，我们定义了replaceTextInDocument函数，该函数将jQuery元素作为参数。

我们使用.contents（）方法来获取元素的所有子节点。

然后，我们使用.each（）方法对每个节点进行迭代。

如果节点是一个文本节点，我们将使用.nodeValue属性替换文本内容。

如果该节点是一个元素节点，我们会递归地调用该元素的replaceTextInDocument函数。

 

最后，你可以使用所需容器元素（如$（'#myContainer'））的jQuery选择器调用replaceTextInDocument函数，以执行批量文本替换。

这个jQuery实现实现了与前面的JavaScript代码相同的结果，允许你在不影响标记和事件绑定的情况下将复杂HTML文档中的某些单词从A替换为B。

 

Cool：ChatAI

Link：https://www.cnblogs.com/farwish/p/17545542.html