站内搜索 高亮显示关键字（兼容火狐 谷歌 ie）

第一通过正则+js实现  

<script>
   function highlighted(ele,keys)
   {
    var reg = new RegExp("(" + keys.replace(/,/,"|") + ")","g");
    ele.innerHTML = ele.innerHTML.replace(reg,"<font color='red'>$1</font>");
   }  
   $(document).ready(
    function highword(){
     var nWord = '${request.searchWord}';
      var array = nWord.split(" ");
      for(var i=0;i<array.length;i++){
       if(array[i]!=""){
        highlighted(document.getElementById("searchResult"),array[i]);
       }
     }
    }
   );
  </script>

 

第二通过jquery或者js实现

  <script>
  function highlighted(keyss) {
   var keys = keyss;
   var bookmark;
   if (document.createRange) {
    var range = document.createRange();
   } else {
    var range = document.body.createTextRange();
    bookmark = range.getBookmark();
   }
   var key;
   for ( var i = 0; key = keys[i];i++) {
    if (range.findText) {
     range.collapse(true);
     range.moveToBookmark(bookmark);
     while (range.findText(key[0])) {
      range.pasteHTML("<span style='color:red; font-weight: bold;'>" + key[0] + "</span>");
     }
    } else {
     var s, n;
     s = window. getSelection();
     s.collapse(document.body, 0);
     while (window.find(key[0])) {
      var n = document.createElement("SPAN");
      $(n).css("color", key[1]);
      $(n).css("font-weight", "bold");
      s.getRangeAt(0).surroundContents(n);
     }
    }
    i=i+1;
   }
  
  }
  $(document).ready(
   function highword(){
    var nWord = '${request.searchWord}';
    alert(nWord);
     var array = nWord.split(" ");
     for(var i=0;i<array.length;i++){
      if(array[i]!=""){
       highlighted(array[i]);
      }
    }
   }
  );
  </script>

 

第三和第二个一样：

<script>

function HighLight(nWord){ 

if(nWord!=''){ 

var keyword = document.body.createTextRange(); 

while(keyword.findText(nWord)){ 

keyword.pasteHTML("<span style='color:red;'>" + keyword.text + "</span>"); 

keyword.moveStart('character',1); 

} 

} 

} 

 

function highword(nWord){ 

  var array = nWord.split(",");

  for(var i=0;i<array.length;i++){

  HighLight(array[i]);

}

} 

 

</script>

第一种可以兼容谷歌和火狐、IE

第二种和第三种在谷歌和火狐下无效，并且会对整个窗口进行高亮显示，本人菜鸟，那位大侠有解决方法，还望指点