html制作搜索页面代码,页内搜索功能源代码

function encode(s){

return s.replace(/&/g,"&").replace(//g,">").replace(/([\.*[]()$^])/g,"\$1");

}

function decode(s){

return s.replace(/\([\.*[]()$^])/g,"$1").replace(/>/g,">").replace(/

}

function highlight(s){

if (s.length==0){

alert('搜索关键词未填写!');

return false;

}

s=encode(s);

var obj=document.getElementsByTagName("body")[0];

var t=obj.innerHTML.replace(/([^<>]*)/gi,"$1");

obj.innerHTML=t;

var cnt=loopSearch(s,obj);

t=obj.innerHTML

var r=/{searchHL}(({(?!/searchHL})|[^{])*){/searchHL}/g

t=t.replace(r,"$1");

obj.innerHTML=t;

alert("搜索到关键词"+cnt+"处")

}

function loopSearch(s,obj){

var cnt=0;

if (obj.nodeType==3){

cnt=replace(s,obj);

return cnt;

}

for (var i=0,c;c=obj.childNodes[i];i++){

if (!c.className||c.className!="highlight")

cnt+=loopSearch(s,c);

}

return cnt;

}

function replace(s,dest){

var r=new RegExp(s,"g");

var tm=null;

var t=dest.nodeValue;

var cnt=0;

if (tm=t.match(r)){

cnt=tm.length;

t=t.replace(r,"{searchHL}"+decode(s)+"{/searchHL}")

dest.nodeValue=t;

}

return cnt;

}

.highlight{background:green;font-weight:bold;color:white;}

一个页内搜索代码,功能很实用,站内搜索经常用到.

以下是HTML网页特效代码,点击运行按钮可查看效果

  • 0
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值