js 如何利用正则递归替换html标签

javascript 如何利用正则递归把<div></div>里的<p>标签全部替换成<br>,其他地方的不替换,例如下面html:

  
<p>
<div>testtest</div>
<p>
<div>
<p>11111
<p>22223
<p>33333
</div>
<p>
<table></table>
</p>

大家不一定要写出代码,给个思路也行呀!

评论 (1)链接2012-03-13 
  • 0 支持
    任何情况下都应该首先考虑使用DOM而不是直接处理HTML;动态改变HTML会使浏览器性能急速下降。用jQuery的话应该不难实现这些功能才对。如果需要最终的HTML,可以用jQuery改变之后,再调用顶层元素的.html() – 灵剑2012 2012-09-09

其实用replace两次就可以实现:

  
<SCRIPT LANGUAGE="JavaScript">
<!--
var str = '<p><div>testtest</div><p><div> <p>11111 <p>22223 <p>33333 </div> <p><table></table></p>';
alert(str.replace(/<div.*?\/div>/ig, function($1){return $1.replace(/<p>/ig,"<br>")}));
//-->
</SCRIPT>
该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (1)链接 • 2012-03-14
  • 0 支持
    这个代码很精辟! – 张海峰 2012-03-14

我给个思路吧:
一、 先按外层循环,找到第一组较大的匹配。正则代码是<div[^>]>[\s\S]?<\/div>
二、定位到这次匹配结束的起始位置,替换掉这一段字串中所有的<p>。
三、然后把替换完成的字符串连接到初始字符串中,循环执行。

我按照这个思路写代码,一直调试不出来,看下面有高手没!

该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (0)链接 • 2012-03-14

其实你可以换个思路,你可以把字符串分段截开,然后把要处理的那段用正则替换后,再拼接回去就可以了。

该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (0)链接 • 2012-03-14
  
<script type="text/javascript">
var str = '<p><div>testtest</div><p><div> <p>11111 <p>22223 <p>33333 </div> <p><table></table></p>';
var reg = /(<div>.*?<\/div>)/gi;

var result = str.match(reg);
for(var i=0; i<result.length; i++){
reg = /<p>/gi;
ret = result[i].replace(reg, '<br />');
str = str.replace(result[i], ret);
}
alert(str);
</script>
该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (0)链接 • 2012-03-14
  
<script type="text/javascript">
var str="<p><div>testtest</div><p><div> <p>11111 <p>22223 <p>33333 </div> <p><table></table></p>";

var patt=/<div[^>]*>[\s\S]*?<\/div>/i;
var wrapper_result=str.split(patt);
var inner_result = str.match(/<div[^>]*>[\s\S]*?<\/div>/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>
该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (0)链接 • 2012-03-14
  
var str = '<p><div>testtest</div><p><div>  <p>11111  <p>22223 <p>33333   </div>   <p><table></table></p>';

str = str.replace(/<div>(.*?)<\/div>/gi,function($1){
return $1.replace(/<p>/gi,'<br />');
})
alert(str);
冯义军
冯义军
14.03K
编辑于 2012-03-14
该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (1)链接 • 2012-03-14
  • 0 支持
    代码很有创意,没想到没想到! – 张海峰 2012-03-14

针对这个问题,我说说思路,如果只针对你问题里的一段HTML字符,那么楼上各位的答案都很好,但是如果要考虑到HTML嵌套那可能就没那么简单了。首先<p>标签有成对标签和自闭合标签。
而<p>标签还可以嵌套。这样就没办法通过正则来实现。如果需要考虑这个,就要先匹配<p>标签然后将其它入栈,遇到</p>标签则出栈,然后替换,如果是自闭合标签<p />则直接替换。代码就不写了,不是一两行代码能搞定。

该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (0)链接 • 2012-03-14
  
<script language="javascript">   
var html = "<div><p>first</p><p>second</p><p>third</p></div>";
var new_html = html.replace(/<p>([\s\S]*?)<\/p>/ig, "<br>");
alert(new_html);
</script>

测试通过。

该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (1)链接 • 2012-03-14
  • 0 支持
    你这个会把不知div里的也给转换掉,并且<p>里的值也会被替换掉 – 鹿鹿_张 2012-03-14
德问是一个专业的编程问答社区,请 登录注册 后再提交答案