js+正文规则 高亮搜索关键字

采用的:
 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>

 

javascript控制关键字高亮显示

js+正文规则  高亮搜索关键字js+正文规则  高亮搜索关键字function SearchHighlight(mytag)  js+正文规则  高亮搜索关键字 {
js+正文规则  高亮搜索关键字     
if  ( ! document.createElement)
js+正文规则  高亮搜索关键字js+正文规则  高亮搜索关键字     
js+正文规则  高亮搜索关键字 {
js+正文规则  高亮搜索关键字         
return ;
js+正文规则  高亮搜索关键字     }

js+正文规则  高亮搜索关键字     var q 
=   " {{$q}} " ; // 要高亮显示的关键字
js+正文规则  高亮搜索关键字
    var l  =  document.getElementsByTagName(mytag);
js+正文规则  高亮搜索关键字     
if ( ""   ==  q)  return ;
js+正文规则  高亮搜索关键字     words 
=  unescape(q.replace( /+/ g, '   ' )).split( / s +/ );
js+正文规则  高亮搜索关键字js+正文规则  高亮搜索关键字     
for  (w = 0 ;w < words.length;w ++ js+正文规则  高亮搜索关键字 {
js+正文规则  高亮搜索关键字         
for (i = 0 ;i < l.length;i ++ )
js+正文规则  高亮搜索关键字js+正文规则  高亮搜索关键字         
js+正文规则  高亮搜索关键字 {
js+正文规则  高亮搜索关键字             var pa 
=   new  RegExp( " ( " + words[w] + " ) " , " ig " );
js+正文规则  高亮搜索关键字             
if (l.parentNode.parentNode.parentNode.id  !=   " header " ) // 标题中的内容不替换
js+正文规则  高亮搜索关键字
            l.innerHTML  =  l.innerHTML.replace(pa, " <span class= " searchword " >$1</span> " );
js+正文规则  高亮搜索关键字         }

js+正文规则  高亮搜索关键字     }

js+正文规则  高亮搜索关键字 }


1、正则表达式
2、向后引用
调用方法:
document.onload = SearchHighlight(”a”);//要搜索的标签名称,这里的意思是凡是形如<a></a>的标记中的内容,包含关 键字的时候均高亮显示。然后把下面的CSS定义加到你的CSS文件里或者直接加到HTML文件中
.searchword{background-color:yellow;}
那么所有的关键字(不论大小写)将显示为黄色背景。


有待分析!

 

 

 

 


上一篇:从0到1:美团端侧CDN容灾解决方案


下一篇:NASA有望成为美国首个完成数据中心优化计划的部门