原生:示例代码
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:文字转语音
Link:https://www.cnblogs.com/farwish/p/17545542.html
标签:node,replaceTextInDocument,文本,函数,替换,html,js,节点 From: https://www.cnblogs.com/farwish/p/17545542.html