高亮功能主要是指对页面中指定区域的指定文字进行高亮显示，也就是背景着色。一般在搜索结果页面会经常用到这个功能。
下面就为大家提供一种解决方案，用javascript实现。
首先在
中引入下面javascript方法： 代码如下:
/// 使用 javascript HTML DOM 高亮显示页面特定字词.
/// 实例:
/// fHl(document.body,'纸伞|她');
/// 这里的body是指高亮body里面的内容。
/// fHl(document.body,'希望|愁怨',false,'/');
/// fHl(document.getElementById('at_main'),'独自|飘过|悠长',true,'search.asp?keyword=');
/// 这里的'at_main'是指高亮id='at_main'的div里面的内容。search.asp?keyword=指给关键字加的链接地址，
/// 我这里加了一个参数，在后面要用到。可以是任意的地址。
///
/// 显示的对象.
///
///
/// 随机显示文字背景色与文字颜色,true 表示随机显示.
///
/// 添加链接.
///
/// $1'); //这里是给关键字加链接，红色的$1是指上面链接地址后的具体参数。
} else {
str=text.replace(re,'$1'); //不加链接时显示
}
o.innerHTML=str;
return o;
}
//------------------------------------------------
function fRndCor(under,over){
if(arguments.length==1){
var over=under;
under=0;
}else if(arguments.length==0){
var under=0;
var over=255;
}
var r=fRandomBy(under,over).toString(16);
r=padNum(r,r,2);
var g=fRandomBy(under,over).toString(16);
g=padNum(g,g,2);
var b=fRandomBy(under,over).toString(16);
b=padNum(b,b,2);
//defaultStatus=r+' '+g+' '+b
return '#'+r+g+b;
function fRandomBy(under,over){
switch(arguments.length){
case 1: return parseInt(Math.random()*under+1);
case 2: return parseInt(Math.random()*(over-under+1) + under);
default: return 0;
}
}
function padNum(str,num,len){
var temp=''
for(var i=0; i
上面的fHl方法就是用来实现高亮的，参数的含义在注释中有写。
然后在页面最后调用fHl方法，对指定区域指定文字高亮着色，例如：
代码如下:
页面body的区域中的“高亮”文字背景着色
怎么样，很简单吧~
原文链接：https://www.f2er.com/js/57326.html