js高亮关键字

Question

<div id="txt"> 
用JS让文章内容指定的关键字加亮
是这样的..现在有这些关键字:美容,生活,购物 
当在文章里头出现这些关键字,就把它加亮显示..
文章是生成静态页面的,而这些关键字是能随时更新的,所以我想用JS来实现... 
</div> 
<script type="text/javascript">
document.getElementById("txt").innerHTML = document.getElementById("txt").innerHTML.replace(/(文章)|(关键字)|(功能)/gi,"<font color=red>$1$2$3</font>"); 
</script>这里能实现将三个关键字高亮，那如何实现取"美容"与"购物"之间的关键字，也就是使用正则表达式美容.*购物这个匹配的结果高亮呢？

Answer 1

<div id="txt"> 
用JS让文章内容指定的关键字加亮
是这样的..现在有这些关键字:美容,生活,购物 
当在文章里头出现这些关键字,就把它加亮显示..
文章是生成静态页面的,而这些关键字是能随时更新的,所以我想用JS来实现... 
</div> 
<script type="text/javascript">
document.getElementById("txt").innerHTML = document.getElementById("txt").innerHTML.replace(/(文章)|(关键字)|(功能)/gi,"<font color=red>$1$2$3</font>"); 
document.getElementById("txt").innerHTML = document.getElementById("txt").innerHTML.replace(/(美容)(.*)(购物)/gi,"$1<font color=red>$2</font>$3"); 
</script>

Answer 2

<div id="txt"> 
用JS让文章内容指定的关键字加亮
是这样的..现在有这些关键字:美容,生活,购物 
当在文章里头出现这些关键字,就把它加亮显示..
文章是生成静态页面的,而这些关键字是能随时更新的,所以我想用JS来实现... 
</div> 
<script type="text/javascript">
//document.getElementById("txt").innerHTML = document.getElementById("txt").innerHTML.replace(/(文章|关键字|功能)/gi,"<font color=red>$1</font>"); 
document.getElementById("txt").innerHTML = document.getElementById("txt").innerHTML.replace(/(美容)(.*?)(购物)/gi,"$1<font color=red>$2</font>$3"); 
</script>

Answer 3

要是不要逗号的话
document.getElementById("txt").innerHTML = document.getElementById("txt").innerHTML.replace(/(美容(,)?)([^,]*)((,)?购物)/gi,"$1<font color=red>$3</font>$4");