使用 javascript 標記高亮關鍵詞)

轉自:http://www.cnblogs.com/cncxz/archive/2007/07/15/818508.html

 /*----------------------------------------*\ 
     * 使用 js 標記高亮關鍵詞 by markcxz(markcxz@aol.com)
     * 參數說明: 
     * obj: 對象, 要進行高亮顯示的html標籤節點. 
     * hlWords: 字串, 要進行高亮的關鍵詞詞, 使用 豎杠(|)或空格 分隔多個詞 . 
     * cssClass: 字串, 定義關鍵詞反白風格的css偽類. 
     * 參考資料: javascript HTML DOM 高亮顯示頁面特定字詞 By shawl.qiu
    \*----------------------------------------*/ 
    function MarkHighLight(obj,hlWords,cssClass){
    
        hlWords=AnalyzeHighLightWords(hlWords);
        
        if(obj==null || hlWords.length==0)
            return;
        if(cssClass==null)
            cssClass="highlight";
        MarkHighLightCore(obj,hlWords);
        
        //------------執行高亮標記的核心方法----------------------------
        function MarkHighLightCore(obj,keyWords){
            var re=new RegExp(keyWords, "i"); 
            
            for(var i=0; i<obj.childNodes.length; i++){
            
                var childObj=obj.childNodes[i];
                if(childObj.nodeType==3){
                    if(childObj.data.search(re)==-1)continue; 
                    var reResult=new RegExp("("+keyWords+")", "gi"); 
                    var objResult=document.createElement("span");
                    objResult.innerHTML=childObj.data.replace(reResult,"<span class='"+cssClass+"'>$1</span>");                     
                    if(childObj.data==objResult.childNodes[0].innerHTML) continue; 
                    obj.replaceChild(objResult,childObj);                                      
                }else if(childObj.nodeType==1){
                    MarkHighLightCore(childObj,keyWords);
                }
            }
        }        

        //----------分析關鍵詞----------------------
        function AnalyzeHighLightWords(hlWords)
        {
            if(hlWords==null) return "";
            hlWords=hlWords.replace(/\s+/g,"|").replace(/\|+/g,"|");            
            hlWords=hlWords.replace(/(^\|*)|(\|*$)/g, "");
            
            if(hlWords.length==0) return "";
            var wordsArr=hlWords.split("|"); 
            
            if(wordsArr.length>1){
                var resultArr=BubbleSort(wordsArr);
                var result="";
                for(var i=0;i<resultArr.length;i++){
                    result=result+"|"+resultArr[i];
                }                
                return result.replace(/(^\|*)|(\|*$)/g, "");

            }else{
                return hlWords;
            } 
        }    
        
        //-----利用冒泡排序法把長的關鍵詞放前面-----    
        function BubbleSort(arr){        
            var temp, exchange;    
            for(var i=0;i<arr.length;i++){            
                exchange=false;                
                for(var j=arr.length-2;j>=i;j--){                
                    if((arr[j+1].length)>(arr[j]).length){                    
                        temp=arr[j+1]; arr[j+1]=arr[j]; arr[j]=temp;
                        exchange=true;
                    }
                }                
                if(!exchange)break;
            }
            return arr;            
        }
    
    }
    //----------------end------------------------