JavaScript关键字高亮显示实现代码

此代码仅供参考

代码说明

屏蔽HTML标签，支持多关键字（以空格间隔），关键字内可含有特殊字符。

html代码

<div class="result" id="result"> 
　　欢迎来到我的磨(wodemo.com)

在这里，你可以:

拥有一个自己的移动手机网站：http://你的名字.wodemo.com
这个网站可以直接用手机访问
在自己的站点上传图片并提供下载
在自己的站点上传手机铃声并提供下载
在自己的站点上传手机软件并提供下载
在自己的站点上传书籍并提供下载和阅读
在自己的站点上传压缩包并在线解压
在自己的站点上传任意类型的文件
在自己的站点撰写文章
用手机拍照之后直接通过手机浏览器(UCWeb, Opera, Safari, Chrome)上传到你的网站
你可以把自己的站点展示给亲朋好友，让他们用手机访问，直接下载图片，铃声和软件。
</div> 
<script> 
function SearchHighlight(idVal,keyword) 
{ 
var pucl = document.getElementById(idVal); 
if("" == keyword) return; 
var temp=pucl.innerHTML; 
var htmlReg = new RegExp("\<.*?\>","i"); 
var arrA = new Array(); 
//替换HTML标签 
for(var i=0;true;i++) 
{ 
var m=htmlReg.exec(temp); 
if(m) 
{ 
arrA[i]=m; 
} 
else 
{ 
break; 
} 
temp=temp.replace(m,"{[("+i+")]}"); 
} 
words = unescape(keyword.replace(/\+/g,' ')).split(/\s+/); 
//替换关键字 
for (w=0;w<words.length;w++) 
{ 
var r = new RegExp("("+words[w].replace(/[(){}.+*?^$|\\\[\]]/g, "\\$&")+")","ig"); 
temp = temp.replace(r,"<b style='color:Red;'>$1</b>"); 
} 
//恢复HTML标签 
for(var i=0;i<arrA.length;i++) 
{ 
temp=temp.replace("{[("+i+")]}",arrA[i]); 
} 
pucl.innerHTML=temp; 
} 
SearchHighlight("result","我的磨 站点 网站"); 
</script>

<div id="result"> 
　　欢迎来到我的磨(wodemo.com)

在这里，你可以:

拥有一个自己的移动手机网站：http://你的名字.wodemo.com
这个网站可以直接用手机访问
在自己的站点上传图片并提供下载
在自己的站点上传手机铃声并提供下载
在自己的站点上传手机软件并提供下载
在自己的站点上传书籍并提供下载和阅读
在自己的站点上传压缩包并在线解压
在自己的站点上传任意类型的文件
在自己的站点撰写文章
用手机拍照之后直接通过手机浏览器(UCWeb, Opera, Safari, Chrome)上传到你的网站
你可以把自己的站点展示给亲朋好友，让他们用手机访问，直接下载图片，铃声和软件。
</div>

代码演示

欢迎来到我的磨(wodemo.com)

在这里，你可以:

拥有一个自己的移动手机网站：http://你的名字.wodemo.com
这个网站可以直接用手机访问
在自己的站点上传图片并提供下载
在自己的站点上传手机铃声并提供下载
在自己的站点上传手机软件并提供下载
在自己的站点上传书籍并提供下载和阅读
在自己的站点上传压缩包并在线解压
在自己的站点上传任意类型的文件
在自己的站点撰写文章
用手机拍照之后直接通过手机浏览器(UCWeb, Opera, Safari, Chrome)上传到你的网站

你可以把自己的站点展示给亲朋好友，让他们用手机访问，直接下载图片，铃声和软件。

JavaScript代码(我的磨版)

注：我的磨专用版代码放在JavaScript框。

修改document.getElementsByTagName("ul")[0];可改变关键字所在区域：

关键字在页面整体内：document.getElementsByTagName("body")[0];
关键字在文件列表内： document.getElementsByTagName("ul")[0];
关键字在某id内(如<div id="keyword">关键字</div>)：document.getElementById("keyword");

具体修改位置已在代码中说明

代码演示

【本站仅供参考，版权归原作者所有】