Question

寻求一些帮助，我的正则表达式有点生锈......

我正在尝试用字符替换javascript中不在HTML标记内的所有字符。

例如，用短划线“ - ”，

替换这些字符

<div class="test">Lorem Ipsum <br/> Dolor Sit Amet</div>

将替换为：

<div class="test">------------<br/>--------------</div>

所以我在寻找

str.replace(/YourMagicalRegEx/g, '-');

请帮助，我得到如何使用正则表达式返回html标签内的文本，使用正则表达式返回html标签内的文本，但所有不在html标签内的字符看起来都很棘手......！

其他挑战：必须是IE7及以上兼容。

Answer 1

使用jQuery：

html = '<div class="test">Lorem Ipsum <br/> Dolor Sit Amet</div>';
node = $("<div>" + html + "</div>");
node.find('*').contents().each(function() {
    if(this.nodeType == 3)
        this.nodeValue = Array(this.nodeValue.length).join('-')

});
console.log(node.html())

（我手头没有IE7，如果有效，请告诉我。）

如果您更喜欢正则表达式，它会是这样的：

html = html.replace(/<[^<>]+>|./g, function($0) {
    return $0[0] == '<' ? $0 : '-';
});

基本上，我们用自己替换标签，用破折号替换不带标签的字符。

Answer 2

您可以找到文档中的所有文本节点，并使用连字符替换其内容，而不是使用仅使用正则表达式的方法。

使用TreeWalker API:

 var tree = document.createTreeWalker(document.body, NodeFilter.SHOW_TEXT);

 while (tree.nextNode()) {
     var textNode = tree.currentNode;
     textNode.nodeValue = textNode.nodeValue.replace(/./g, '-');
 }

递归解决方案：

function findTextNodes(node, fn){
  for (node = node.firstChild; node;node=node.nextSibling){
    if (node.nodeType === Node.TEXT_NODE) fn(node);
    else if(node.nodeType === Node.ELEMENT_NODE && node.nodeName !== 'SCRIPT') findTextNodes(node, fn);
  }
}


findTextNodes(document.body, function (node) {
  node.nodeValue = node.nodeValue.replace(/./g, '-');
});

谓词node.nodeName !== 'SCRIPT'是防止函数替换正文中任何脚本内容所必需的。

Javascript RegEx替换不在HTML标记内的所有字符

2 个答案: