BlogJava-ansenhuang-文章分类-javaScripthttp://www.blogjava.net/ansenhuang/category/25021.htmlzh-cnSun, 19 Aug 2007 02:54:11 GMTSun, 19 Aug 2007 02:54:11 GMT60关键字高亮显示http://www.blogjava.net/ansenhuang/articles/137333.htmlansenhuangansenhuangThu, 16 Aug 2007 08:58:00 GMThttp://www.blogjava.net/ansenhuang/articles/137333.htmlhttp://www.blogjava.net/ansenhuang/comments/137333.htmlhttp://www.blogjava.net/ansenhuang/articles/137333.html#Feedback0http://www.blogjava.net/ansenhuang/comments/commentRss/137333.htmlhttp://www.blogjava.net/ansenhuang/services/trackbacks/137333.htmlfunction 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 SearchHighlight() {  
    highlightWord(document.getElementsByTagName("body")[0],'a');  
    highlightWord(document.getElementsByTagName("body")[0],'q');
}  
 
window.onload = SearchHighlight;
 
</script>  
 
 例：
（描述：复制一下代码粘贴到html文件中，直接运行查看效果）
<html>
<head>
<title>asfdsadf</title>
<meta http-equiv=Content-Type content="text/html; charset=utf-8">
<style type="text/css">
  .searchword {     background-color: red; }
</style>
<script language=javascript>  
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 SearchHighlight() {  
    highlightWord(document.getElementsByTagName("body")[0],'a');  
    highlightWord(document.getElementsByTagName("body")[0],'q');
}  
 
window.onload = SearchHighlight;
 
</script>   </head>
<body bgcolor=#ffffff>
<table>
 <tr>
  <td>
   aaaaaabbbbbbaaacc cc bb ss aa bb qq dd
   
  </td>
 </tr> 
</table>
</body>
</html>


ansenhuang 2007-08-16 16:58 发表评论
]]>