分享

js 高亮显示 查找关键字

 南郡修道院 2011-12-18
js 高亮显示 查找关键字---最简单的方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">

<SCRIPT LANGUAGE="JavaScript">
<!--
var str="";
//高亮显示
function HighLight(nWord){
   var orange = document.body.createTextRange();
   str=nWord.value;
   while(orange.findText(nWord.value)){
    orange.pasteHTML("<span style='color:red;'>" + orange.text + "</span>");
    //orange.moveStart('character',1);
   }

}

//还原高亮显示
function huifu()
{
   var orange = document.body.createTextRange();
   if(str!="")
   {
    while(orange.findText(str)){
    orange.pasteHTML("<span style='color:#000000;'>" + orange.text + "</span>");
   // orange.moveStart('character',1);
   }
   }
  
}
//-->
</SCRIPT>
</HEAD>

<BODY>
<INPUT TYPE="text" NAME="" onblur=" HighLight(this)" onchange="huifu()"><br/>
aaaaaaaaa sdasdasdf<br/>fdddddd<br/>dddddddfffffggggggui....;;;;;;;;;;kkkkkkkkk<br/>ggggggggggggggggg<br/>
mmmmmmmtyutyuer<br/>iuyoiuouiopiooooooooolkasq
</BODY>
</HTML>


    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多