采用的:
function HighlightText(obj,keyword)
{
if(document.referrer){
var reg=new RegExp(keyword,"g"); //创建正则RegExp对象
var regdx=keyword;
var data=document.getElementById(obj).innerHTML;//替换范围获取源代码
document.getElementById(obj).innerHTML=data.replace(reg,'<span class="cC30">'+regdx+'</span>');//根据正则表达式替换
var reg=new RegExp(keyword.toLowerCase(),"g"); //创建正则RegExp对象
var regdx=keyword.toLowerCase();
var data=document.getElementById(obj).innerHTML;//替换范围获取源代码
document.getElementById(obj).innerHTML=data.replace(reg,'<span class="cC30">'+regdx+'</span>');//根据正则表达式替换
var reg=new RegExp(keyword.toUpperCase(),"g"); //创建正则RegExp对象
var regdx=keyword.toUpperCase();
var data=document.getElementById(obj).innerHTML;//替换范围获取源代码
document.getElementById(obj).innerHTML=data.replace(reg,'<span class="cC30">'+regdx+'</span>');//根据正则表达式替换
}
}
window.onload=function(){HighlightText('news','123');};
网络资源:
<script type=
"text/javascript" >
<!--
// 说明:获取搜索引擎关键字 并高亮 显示
// 整理:http://www.CodeBit.cn
/* http://www.kryogenix.org/code/browser/searchhi/ */
/* Modified 20021006 to fix query string parsing and add case insensitivity */
function highlightWord
( node,word
)
{
// Iterate into this nodes childNodes
if
( node.
hasChildNodes
)
{
var hi_cn;
for
( hi_cn=
0 ;hi_cn<node.
childNodes .
length ;hi_cn++
)
{
highlightWord
( node.
childNodes
[ hi_cn
] ,word
) ;
}
}
// And do this node itself
if
( node.
nodeType ==
3
)
{
// text node
tempNodeVal = node.
nodeValue .
toLowerCase
(
) ;
tempWordVal = word.
toLowerCase
(
) ;
if
( tempNodeVal.
indexOf
( tempWordVal
) !=
-1
)
{
pn = node.
parentNode ;
if
( pn.
className !=
"searchword"
)
{
// word has not already been highlighted!
nv = node.
nodeValue ;
ni = tempNodeVal.
indexOf
( tempWordVal
) ;
// Create a load of replacement nodes
before = document.
createTextNode
( nv.
substr
(
0 ,ni
)
) ;
docWordVal = nv.
substr
( ni,word.
length
) ;
after = document.
createTextNode
( nv.
substr
( ni+word.
length
)
) ;
hiwordtext = document.
createTextNode
( docWordVal
) ;
hiword = document.
createElement
(
"span"
) ;
hiword.
className =
"searchword" ;
hiword.
appendChild
( hiwordtext
) ;
pn.
insertBefore
( before,node
) ;
pn.
insertBefore
( hiword,node
) ;
pn.
insertBefore
( after,node
) ;
pn.
removeChild
( node
) ;
}
}
}
}
function googleSearchHighlight
(
)
{
if
( !document.
createElement
)
return ;
ref = document.
referrer ;
if
( ref.
indexOf
(
'?'
) ==
-1
)
return ;
qs = ref.
substr
( ref.
indexOf
(
'?'
)
+1
) ;
qsa = qs.
split
(
'&'
) ;
for
( i=
0 ;i<qsa.
length ;i++
)
{
qsip = qsa
[ i
] .
split
(
'='
) ;
if
( qsip.
length ==
1
)
continue ;
if
( qsip
[
0
] ==
'q' || qsip
[
0
] ==
'p'
)
{
// q= for Google, p= for Yahoo
words = unescape
( decodeURIComponent
( qsip
[
1
] .
replace
(
//+/g ,
' '
)
)
) .
split
(
//s+/
) ;
for
( w=
0 ;w<words.
length ;w++
)
{
highlightWord
( document.
getElementsByTagName
(
"body"
)
[
0
] ,words
[ w
]
) ;
}
}
}
}
window.
onload = googleSearchHighlight;
//-->
</script>
function SearchHighlight(mytag)
{
if ( ! document.createElement)
{
return ;
}
var q = " {{$q}} " ; // 要高亮显示的关键字
var l = document.getElementsByTagName(mytag);
if ( "" == q) return ;
words = unescape(q.replace( /+/ g, ' ' )).split( / s +/ );
for (w = 0 ;w < words.length;w ++ ) {
for (i = 0 ;i < l.length;i ++ )
{
var pa = new RegExp( " ( " + words[w] + " ) " , " ig " );
if (l.parentNode.parentNode.parentNode.id != " header " ) // 标题中的内容不替换
l.innerHTML = l.innerHTML.replace(pa, " <span class= " searchword " >$1</span> " );
}
}
}
1、正则表达式
2、向后引用
调用方法:
document.onload = SearchHighlight(”a”);//要搜索的标签名称,这里的意思是凡是形如<a></a>的标记中的内容,包含关 键字的时候均高亮显示。然后把下面的CSS定义加到你的CSS文件里或者直接加到HTML文件中
.searchword{background-color:yellow;}
那么所有的关键字(不论大小写)将显示为黄色背景。
有待分析!