html表格绑定xml数据 数据岛,查询绑定数据岛的表格中的文本并修改显示方式的js代码...

function findAll(s){

if(s.length==0){

alert("请输入查询关键字");

}

s=encode(s);

var TDs=document.all.DataT1.all.tags("TD");

var num=0;

for(var i=0;i

var tdObj=TDs[i];

var obj=tdObj.childNodes[0];

if(!obj.className || obj.className!="highlight"){

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;

num=num+cnt;

}

}

alert("查找到关键字"+num+"处");

}

function encode(s){

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

}

function decode(s){

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

}

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,"gi");

var tm=null;

var t=dest.nodeValue;

var cnt=0;

var arr=new Array();

var a="";

var b="";

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

cnt=tm.length;

a=tm.toString();

arr=a.split(",");

for(var i=0;i

b="{searchHL}"+arr[i]+"{/searchHL}";

t=t.replace(r,b);

dest.nodeValue=t;

}

return cnt;

}

.highlight{background:blue;font-weigh:bold;color:black;}

以上方法需要注意的有两点:1,在findAll 中obj取到最小单位,否则的话替换会出乱,我在实践中体会这一点主要是和数据岛绑定有关,一般的文本是不需要这么小心的.2,replace方法将tm拆分成数组,也和表格有关,一般的文本不需要拆分

如果是一般的文本可以如下写

function findAll(s){

if (s.length==0){

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

return false;

}

s=encode(s);

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

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

t=obj.innerHTML

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

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

obj.innerHTML=t;

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

}

function replace(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;

}

html部分

IDNameDesc

PCOMM11

caracter handle

hkdlhglfghfkgfk

PCOMM12

digital handle

hkdlhglfghfkgfkgggg

总结

如果觉得编程之家网站内容还不错，欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。

小编个人微信号 jb51ccc

喜欢与人分享编程技术与工作经验，欢迎加入编程之家官方交流群！