巧解 JavaScript 中的嵌套替换(强大正则)

网友wys提问：如何仅使用JavaScript支持的正则语法，将

代码如下:

<p>
<table> <p> <p> </table>
<table> <p> <p> </table>
<p>

中<table>...</table>之间的<p>都替换为<br/>?
思考
该问题的难点之一在于JavaScript支持的正则特性实在有限。楼主已经想到了非JavaScript的解法，如下：


代码如下:

re=/(?<=<table.*?)(<p>)(?=.*?<\/table>)/gi;
alert (sourcestr.replace(re,"<br>"));

嗯，思路大致是这样。较真起来，即使JavaScript支持逆序环视，上面答案并不能够如愿运行。原因是带有量词的逆序环视(即在(?<=)里面使用?, *, +, {}这样的量词)是更高级的的语法，极少有语言能够支持（特例是.Net）。

但是，像楼主这样的正则问题应该是很普便的一个问题，我们经常需要循环地替换一些内容。该如何解答呢？

思路一

阅读JavaScript的文档，我找到了lastIndex这样的东东。根据这个东东，我形成了这样的思路：
•先按外层循环，找到第一组较大的匹配。正则代码是<table[^>]*>[\s\S]*?<\/table>
•定位到这次匹配结束的起始位置，替换掉这一段字串中所有的<p>。
•循环执行。
我觉得上述思路大致清晰，但是细节太多（每次匹配涉及3个位置点，一个长度），解起来并非从容不迫，最终的代码想必也不会赏心悦目；尤为重要的是，整个思路像是原始的 Crack，而不是高手的 Hack 。而且思路与正则关系不大。我决定换一条路。

思路二

关键是循环和嵌套。还好不是盗梦空间的深层递归。能否将匹配的内容保护起来，替换完之后再放回原位呢？

想到这里，就豁然开朗了。

思路：先找到所有的匹配内容，记路在数组inner中；

同时使用该正则，将原字串split为另一个数组wrapper；

一个重要的特点是，wrapper一定比inner多一个元素，它一一将inner项隔开，并处于最外层。wrapper 和 inner 的关系，就像是一个手掌的5根指头与4个指缝的关系。将中间的元素取出，记下位置，等处理完之后，再将所有的元素粘合在一起。就是这样简单。代码如下（为了让问题更有普使性，我稍改了一下源字串）：

代码如下:

<script type="text/javascript">
var str="<p> <table> <p> ,<p> </table> <p> <table> <p> <p> </table> <p> <table> <p> <p> </table>";

var patt=/<table[^>]*>[\s\S]*?<\/table>/i;
var wrapper_result=str.split(patt);
var inner_result = str.match(/<table[^>]*>[\s\S]*?<\/table>/ig);

var len=inner_result.length;
var final=wrapper_result[0];

for (i=0; i<len; i++)
{
tmp=inner_result[i].replace(/<p>/gi,"<br>");
final+=tmp+wrapper_result[i+1];
}
alert(final);
</script>

贴图：

更新

果然是能人辈出，评论更精彩！请看评论中的这则代码：


代码如下:

alert(sourcestr.replace(/<table.*?\/table>/ig, function($1){return $1.replace(/<p>/ig,"<br>")}));

PS: 本站刚刚添加了评论中代码的解析，可以贴代码了。格式见评论部分的图例显示。谢谢合作！

赞 (0)

相关推荐

  • js正则表达式replace替换变量方法

    JavaScript正则实战(会根据最近写的不断更新) 1.javascript 正则对象替换创建 和用法: /pattern/flags 先简单案例学习认识下replace能干什么 正则表达式构造函数: new RegExp("pattern"[,"flags"]); 正则表达式替换变量函数:stringObj.replace(RegExp,replace Text); 参数说明: pattern -- 一个正则表达式文本 flags -- 如果存在,将是以下值:

  • js正则实现的密码框简单制作,还可以替换成自己想用得符号

    密码框简单制作,还可以替换成自己想用得符号. <style type="text/css"> #c { position: relative; } #a { position: absolute; left: 0; top: 0; font-size: 12px; font-family: 宋体; } #b { position: absolute; left: 0; top: 0; font-size: 12px; font-family: 宋体; -moz-opacit

  • JS利用正则配合replace替换指定字符

    定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. 语法 stringObject.replace(regexp,replacement) 参数 描述 regexp 必需.规定了要替换的模式的 RegExp 对象.请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象. replacement 必需.一个字符串值.规定了替换文本或生成替换文本的函数. 返回值 一个新的字符串,是用 repl

  • JS、replace利用正则表达式替换SQL所有参数为指定格式的数据

    SQL参数格式 例如:select * from tb where nd=:nd and yd=:yd 想一次性把所有SQL语句中参数(带冒号)全部换成数据, 开始 选定用正则表达式. 原先写这样 复制代码 代码如下: strsql.replace(/(:\w+)/g,("$1").substring(1)); "$1" 总是本解析成字符串,而不是匹配的值 换成 复制代码 代码如下: strsql.replace(/(:\w+)/g,$1); 又不能给出匹配值,$1

  • javascript replace()正则替换实现代码

    复制代码 代码如下: var data = "123123,213,<,12312,>,312,3,cat,dsfsdfs,"; alert(func(data)); function func(str) { var reg = /<|>/g; str = str.replace(reg,function($1){ if($1=='<'){ return '<'; }else{ return '>'; } }); return str; } 很

  • JS使用正则表达式过滤多个词语并替换为相同长度星号的方法

    JS使用正则表达式过滤多个词语并替换为相同长度星号的方法

    本文实例讲述了JS使用正则表达式过滤多个词语并替换为相同长度星号的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"

  • JS使用正则表达式实现关键字替换加粗功能示例

    JS使用正则表达式实现关键字替换加粗功能示例

    本文实例讲述了JS使用正则表达式实现关键字替换加粗功能的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

  • js正则查找match()与替换replace()用法实例

    本文实例讲述了js中正则的查找match()与替换replace()的用法.分享给大家供大家参考.具体如下: 复制代码 代码如下: <html> <head> <script type="text/javascript"> //string.match(正则):正则查找字符串,返回符合正则的字符或字符串 function t1(){  var con = document.getElementsByName('content')[0].value;/

  • js 替换功能函数，用正则表达式解决，js的全部替换

    alert("abacacf".replace('a','9')); alert("abacacf".replace(/a/g,'9')); 第一个运行的结果 9bacaf 这个只是替换了第一个 第二个运行的结果 9b9c9f 这个能实现js的全部替换功能 其实第二个的意思就是用正则表达式实现全局的替换 g 代表 gobal 另附:带有特殊符号的全局替换 复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HT

  • js使用正则实现ReplaceAll全部替换的方法

    JS 字符串有replace() 方法.但这个方法只会对匹配到的第一个字串替换. 如下例: <HTML> <HEAD> <TITLE> New Document </TITLE> </HEAD> <BODY> <script> var str = "wordwordwordword"; var strNew = str.replace("word","Excel"

  • JavaScript replace(rgExp,fn)正则替换的用法

    代码如下: 复制代码 代码如下: var rxhtmlTag = /(<([\w:]+)[^>]*?)\/>/g, rselfClosing = /^(?:area|br|col|embed|hr|img|input|link|meta|param)$/i, fcloseTag = function(all, front, tag) { return rselfClosing.test(tag) ? all : front + "></" + tag +

  • javascript用正则表达式把1234567890替换为abcdefghij

    复制代码 代码如下: <script> alert('0123456789'.replace(/(\d)/g, function ($1){return "abcdefghij".split("")[$1];})); </script>

随机推荐