采用的:
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.οnlοad=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>
javascript控制关键字高亮显示
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;}
那么所有的关键字(不论大小写)将显示为黄色背景。
有待分析!