JavaScript正则表达式-匹配和替换匹配中的多个匹配项_Javascript_Jquery_Regex

JavaScript正则表达式-匹配和替换匹配中的多个匹配项

javascript jquery regex

JavaScript正则表达式-匹配和替换匹配中的多个匹配项,javascript,jquery,regex,Javascript,Jquery,Regex,我试图在一些HTML标记之间替换一个单词的所有实例，比如“foo” <span id=foo> blah blah foo blah foo blah </span> 废话废话废话废话废话我想用bar替换标记中不存在的所有foo实例，因此最终结果是： <span id=foo> blah blah bar blah bar blah </span> 胡说八道请注意，span标记中的“foo”未被替换我可以设法用我的正则表达式替换第一次

我试图在一些HTML标记之间替换一个单词的所有实例，比如“foo”

<span id=foo> blah blah foo blah foo blah </span>

废话废话废话废话废话

我想用bar替换标记中不存在的所有foo实例，因此最终结果是：

<span id=foo> blah blah bar blah bar blah </span>

胡说八道

请注意，span标记中的“foo”未被替换

我可以设法用我的正则表达式替换第一次（或最后一次）出现的“foo”，但不能有多个实例。在这种情况下，我应该放弃，而不尝试用正则表达式解析它吗

下面是一个正则表达式，它可以工作：

RegExp('(>[\\w\\s]*)\\bfoo\\b([\\w\\s]*<)',"ig"

RegExp（'（>[\\w\\s]*）\\bfoo\\b（[\\w\\s]*以下操作似乎有效：
var str = "foo yea foot bfoo <span id=foo> blah blah foo blah foo blah </span> foo again <span id=foo>foo again</span>\n\nthis is foo again";
var r = new RegExp("\\bfoo\\b","ig");
str = str.replace(r, "'it works'");
alert(str);

var str=“foo yea foot bfoo blah foo blah foo blah foo又一次foo又一次\n\n这是foo又一次”；
var r=new RegExp（“\\bfoo\\b”，“ig”）；
str=str.replace（r，“'it works'”）；
警报（str）；
以下各项似乎有效：
var str = "foo yea foot bfoo <span id=foo> blah blah foo blah foo blah </span> foo again <span id=foo>foo again</span>\n\nthis is foo again";
var r = new RegExp("\\bfoo\\b","ig");
str = str.replace(r, "'it works'");
alert(str);

var str=“foo yea foot bfoo blah foo blah foo blah foo又一次foo又一次\n\n这是foo又一次”；
var r=new RegExp（“\\bfoo\\b”，“ig”）；
str=str.replace（r，“'it works'”）；
警报（str）；
如果将正则表达式的结果保存为匹配对象，如下所示：
var regex = new RegExp('(>[\\w\\s]*)\\bfoo\\b([\\w\\s]*<)',"ig");
var mystring = "<span id=foo> blah blah foo blah foo blah </span>";
var match = regex.exec(mystring);

var regex=new RegExp（'（>[\\w\\s]*）\\bfoo\\b（[\\w\\s]*如果将正则表达式的结果保存为以下匹配对象：
var regex = new RegExp('(>[\\w\\s]*)\\bfoo\\b([\\w\\s]*<)',"ig");
var mystring = "<span id=foo> blah blah foo blah foo blah </span>";
var match = regex.exec(mystring);

var regex=new RegExp（'（>[\\w\\s]*）\\bfoo\\b（[\\w\\s]*str=str.replace（/（>[^str=str.replace（/（>[^我不知道以前是否有人提到过这一点，但是：
不要使用正则表达式操作HTML。
这是一个很差的工具，远远不能处理HTML的复杂性。如果您开始替换标记中的字符串，您不仅可以很容易地找到损坏的标记，还可以找到可能导致跨站点脚本漏洞的HTML注入漏洞。这：
(>[\\w\\s]*)

不足以确保正在更改的HTML不在标记中。在属性值中包含
字符是完全有效的，更不用说所有其他标记结构了
如果您的语言是在web浏览器中运行的JavaScript，那么甚至没有理由尝试，因为浏览器已经将您的文档很好地解析为元素对象和文本节点。不要要求浏览器将所有这些文档对象重新序列化为新的HTML，修改HTML并将其写回innerHTML
！以及低，这将销毁所有现有内容以用新对象替换它，其副作用是丢失所有不可序列化的信息，如表单字段值、JavaScript引用、expandos和事件处理程序
您只需遍历要查看的元素中的所有文本节点即可进行替换。简单示例：
function replaceText(element, pattern, replacement) {
    for (var childi= element.childNodes.length; childi-->0;) {
        var child= element.childNodes[childi];
        if (child.nodeType==1) # Node.ELEMENT_NODE
            replaceText(child, pattern, replacement);
        else if (child.nodeType==3) # Node.TEXT_NODE
            child.data= child.data.replace(pattern, replacement);
    }
}

replaceText($('#foo')[0], /\bfoo\b/gi, 'bar');

我不知道以前是否有人提到过这一点，但是：
不要使用正则表达式操作HTML。
这是一个很差的工具，远远不能处理HTML的复杂性。如果您开始替换标记中的字符串，您不仅可以很容易地找到损坏的标记，还可以找到可能导致跨站点脚本漏洞的HTML注入漏洞。这：
(>[\\w\\s]*)

不足以确保正在更改的HTML不在标记中。在属性值中包含
字符是完全有效的，更不用说所有其他标记结构了
如果您的语言是在web浏览器中运行的JavaScript，那么甚至没有理由尝试，因为浏览器已经将您的文档很好地解析为元素对象和文本节点。不要要求浏览器将所有这些文档对象重新序列化为新的HTML，修改HTML并将其写回innerHTML
！以及低，这将销毁所有现有内容以用新对象替换它，其副作用是丢失所有不可序列化的信息，如表单字段值、JavaScript引用、expandos和事件处理程序
您只需遍历要查看的元素中的所有文本节点即可进行替换。简单示例：
function replaceText(element, pattern, replacement) {
    for (var childi= element.childNodes.length; childi-->0;) {
        var child= element.childNodes[childi];
        if (child.nodeType==1) # Node.ELEMENT_NODE
            replaceText(child, pattern, replacement);
        else if (child.nodeType==3) # Node.TEXT_NODE
            child.data= child.data.replace(pattern, replacement);
    }
}

replaceText($('#foo')[0], /\bfoo\b/gi, 'bar');

我很困惑，你为什么不能：
var replacement = $('#foo').html().replace(/\bfoo\b/g, '');
$('#foo').html(replacement);

我很困惑，你为什么不能：
var replacement = $('#foo').html().replace(/\bfoo\b/g, '');
$('#foo').html(replacement);

我试图以错误的方式进行此操作。这是我创建的解决方案，似乎效果很好。它使用两个递归函数+DOM遍历+正则表达式来创建正确的文本和跨节点
function replaceText(element, pattern, syn_text) {

for (var childi = 0; childi < element.childNodes.length;childi++) {
    var child= element2.childNodes[childi];
    if (child.nodeType==1 && child.className!=syn_text){ //make sure we don't call function on newly created node
        replaceText(child, pattern, syn_text);  //call function on child
    }
    else if (child.nodeType==3){ //this is a text node, being processing with our regular expression
        var str = child.data;
        str = str.replace(pattern,function(s, p1,p2,p3) {
            var parentNode = child.parentNode;
            do_replace(s, p1,p2,p3,parentNode,pattern,syn_text);
            parentNode.removeChild(child);  //delete old child from parent node.  we've replaced it with new nodes at this point
         });
    }
}}




function do_replace(s, p1,p2,p3,parentNode,pattern,syn_text) {
   if(p1.length>0){   //this might not be necessary
     //create textnode
      var text_node = document.createTextNode(p1);
      parentNode.appendChild(text_node);
   }
   if(p2.length > 0){ //create a span + next_node for the highlighting code
      spanTag = document.createElement("span");
      spanTag.id = "SString" + id++;
      spanTag.className = syn_text;
      spanTag.innerHTML = p2;
      parentNode.appendChild(spanTag);
   }
   if(p3.length > 0){
       //test to see if p3 contains another instance of our string.

      if(pattern.test(p3)){  //if there is a instance of our text string in the third part of the string, call function again
          p3.replace(pattern,function(s, p1,p2,p3) {
            //debugger;
            do_replace(s, p1,p2,p3,parentNode,pattern);
            return;
          });
      }
      else{  //otherwise, it's just a plain textnode, so just reinsert it.
          var text_nodep3 = document.createTextNode(p3);
          parentNode.appendChild(text_nodep3);
          return;
      }
    }
    else{ //does this do anything?
        return;
     }
return}

我试图以错误的方式进行此操作。这是我创建的解决方案，似乎效果很好。它使用两个递归函数+DOM遍历+正则表达式来创建正确的文本和跨节点
function replaceText(element, pattern, syn_text) {

for (var childi = 0; childi < element.childNodes.length;childi++) {
    var child= element2.childNodes[childi];
    if (child.nodeType==1 && child.className!=syn_text){ //make sure we don't call function on newly created node
        replaceText(child, pattern, syn_text);  //call function on child
    }
    else if (child.nodeType==3){ //this is a text node, being processing with our regular expression
        var str = child.data;
        str = str.replace(pattern,function(s, p1,p2,p3) {
            var parentNode = child.parentNode;
            do_replace(s, p1,p2,p3,parentNode,pattern,syn_text);
            parentNode.removeChild(child);  //delete old child from parent node.  we've replaced it with new nodes at this point
         });
    }
}}




function do_replace(s, p1,p2,p3,parentNode,pattern,syn_text) {
   if(p1.length>0){   //this might not be necessary
     //create textnode
      var text_node = document.createTextNode(p1);
      parentNode.appendChild(text_node);
   }
   if(p2.length > 0){ //create a span + next_node for the highlighting code
      spanTag = document.createElement("span");
      spanTag.id = "SString" + id++;
      spanTag.className = syn_text;
      spanTag.innerHTML = p2;
      parentNode.appendChild(spanTag);
   }
   if(p3.length > 0){
       //test to see if p3 contains another instance of our string.

      if(pattern.test(p3)){  //if there is a instance of our text string in the third part of the string, call function again
          p3.replace(pattern,function(s, p1,p2,p3) {
            //debugger;
            do_replace(s, p1,p2,p3,parentNode,pattern);
            return;
          });
      }
      else{  //otherwise, it's just a plain textnode, so just reinsert it.
          var text_nodep3 = document.createTextNode(p3);
          parentNode.appendChild(text_nodep3);
          return;
      }
    }
    else{ //does this do anything?
        return;
     }
return}

嗨，我在做一个用jquery替换的reg-ex，在我自己的网站上加粗所有p标签的第一个单词。
我想代码也可以回答你的问题

<!DOCTYPE html>
<html>
<head>
<title>JQ Replace foo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#foo {color:#00c;}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('* #foo').each(function(){  //use star to select all elements with id=foo
var me = $(this);
me.html(me.text().replace(/foo/g,"bar"));  // only change text 'foo' to 'bar' , not the html id=foo
});
});
</script> 
</head>
<body>
<div id="foo"> blah blah foo blah foo blah </div>
<p id="foo"> blah blah foo blah foo blah </p>
<a id="foo"> blah blah foo blah foo blah </a>
</body>
</html>


JQ取代foo
#foo{color:#00c；}
$（文档）.ready（函数（）{
$（'*#foo'）。每个（函数（）{//使用星号选择id=foo的所有元素
var me=$（此）；
me.html（me.text（）.replace（/foo/g，“bar”）；//仅将文本“foo”更改为“bar”，而不是html id=foo
});
});
废话废话废话废话废话废话
废话废话废话
废话废话废话废话废话废话

简单但对我有用
John Guise（新西兰）您好，我正在用jquery替换reg ex，以加粗我自己网站上所有p标签的所有首字。
我想代码也可以回答你的问题

<!DOCTYPE html>
<html>
<head>
<title>JQ Replace foo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#foo {color:#00c;}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('* #foo').each(function(){  //use star to select all elements with id=foo
var me = $(this);
me.html(me.text().replace(/foo/g,"bar"));  // only change text 'foo' to 'bar' , not the html id=foo
});
});
</script> 
</head>
<body>
<div id="foo"> blah blah foo blah foo blah </div>
<p id="foo"> blah blah foo blah foo blah </p>
<a id="foo"> blah blah foo blah foo blah </a>
</body>
</html>


JQ取代foo
#foo{color:#00c；}
$（文档）.ready（函数（）{
$（'*#foo'）。每个（函数（）{//使用星号选择id=foo的所有元素
var me=$（此）；
me.html（me.text（）.replace（/foo/g，“bar”）；//仅将文本“foo”更改为“bar”，而不是html id=foo
});
});
废话废话废话废话废话废话
废话废话废话
废话废话废话废话废话废话

简单但对我有用
John Guise（新西兰）
一般来说，您需要什么