复杂的html string.replace函数

时间:2010-11-21 06:23:01

标签: javascript html regex string replace

我有一个非常简单的html,它是从像这样的字符串的jSon数据库生成的:

"<div style=\"padding-top:59px;\"><a href=\"http://www.macm.org/en/index.html\"><img src=\"http://www.artimap.com/montreal/www.macm.org.jpg\"><br>www.macm.org/en/index.html</a><h1>Musée d'art contemporain de Montréal</h1><p></p><p>A major Canadian institution dedicated exclusively to contemporary art, the Musée offers a varied program ranging from presentations of its Permanent Collection to exhibitions of works by Québec, Canadian and international artists. The Permanent Collection comprises some 7,000 works, including the largest collection of art by Paul-Émile Borduas.</p><div><p>185, Sainte-Catherine West (corner Jeanne-Mance)</p><p>H2X 3X5</p></div><b>514 847-6226</b></div>"

变量RESULTSshow是这些字符串的串联,另一个var:searchterm是搜索词。我想通过HTM1&lt; i&gt; searchterm&lt; / i&gt;将每个出现的searchterm包含在结果中。我正在为我所参与的每个标签使用这些正则表达式和函数,例如:

var REG=new RegExp(searchterm,'gmi');
var regFUN=function(x){return x.replace(REG,"<i>$&</i>");};
var reg = new RegExp('<p>(.*?)</p>','gmi');
RESULTSshow=RESULTSshow.replace(reg,regFUN);
(I do this for every tags I am interested in highlighting) 
This does <i>"searchterm"</i> but also gives <<i>p</i>> if searchterm==="p" wich really bugs me for the two last days.

问题是如果searchterm是“p”,那么这不仅会更改标签内的文本,还会更改标签本身。

如何阻止它更改标签?我真的想用一个regExp来做,而不是为了速度而循环通过html(dom)。

2 个答案:

答案 0 :(得分:1)

现在使用这个精彩的小RegExp而不是过于复杂的第一个:

REG=new RegExp("(?![^<>]*>)("+searchterm+")","gi");
RESULTSshow=RESULTSshow.replace(REG,'<i>$1</i>');

答案 1 :(得分:0)

好吧,考虑到你的HTML不包含像SCRIPT,CDATA,STYLE这样的块,可以使用前瞻性的正则表达式:

text = text.replace(/(?![^<>]*>)old/g, 'new');

虽然我会使用轻型解析器或自制的解析器而不必担心速度以获得更好的支持。请注意,如果您的属性可能包含<>个字符,则需要处理来源。

试试这个:

<html>
<head>
<script>
function t() {
    text = "<html><head></head><body><p>SuperDuck</p><p>Jumps over the lazy dog</p></body></html>";
    a = text.replace(/(?![^<>]*>)(p)/g, '<i>$1</i>');
    alert (a);
}
</script>
</head>
<body>
    <button onclick="t();">hit me!</button>
</body>
</html>

只需替换替换字符串中的(p),您就可以跳过=)