脚本宝典收集整理的这篇文章主要介绍了详细介绍如何使用javascript+xml实现分页，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。基于web的技术中，分页是一个老的不能再老的，但大家津津乐道的问题，随着XMl技术的日渐应用，把xML应用到分页当中，也是一种可能，当然网上的教程很多，当我都是看得稀里糊涂，索性自己写一个，与大家分享、指正。
<!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=""> <link rel="stylesheet" href="../website.CSS" type="text/css"> </HEAD> <BODY> <script language="javascript"> //****************变量相关定义************** //* author:海仔 * //* Email:rautinee@21cn.COM * //*本程序可自由传播使用，但请务必保留此信息 * //**************************************** VAR pagenum=4; //每页显示几条信息 var page=0 ; var contpage ; var BodyText=""; var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); var mode="member"; var toolBar; xmlDoc.async="false" xmlDoc.load("tt.xml") //***************这个地方是你根据实际取得的字段名称来改了 header="<TABLE border=1><tr><td>姓名</td><td>图标</td><td>IP地址</td><td>email</td><td></td><td>日期</td><td></td><td></td></tr>"; //检索的记录数 maxNum = xmlDoc.getelementsbytagname(mode).length //每条记录的列数 column=xmlDoc.getElementsByTagName(mode).item(0).childNodes //每条记录的列数 colNum=column.length //页数 pagesNumber=Math.ceil(maxNum/pagenum)-1; pagesNumber2=Math.ceil(maxNum/pagenum); //上一个页面 function UpPage(page) { thePage="前一页"; if(page+1>1) thePage="<A HREF='#' onclick='Javascript:return UpPageGo()'>前一页</A>"; return thePage; } function NextPage(page) { thePage="后一页"; if(page<pagesNumber) thePage="<A HREF='#' onclick='Javascript:return NextPageGo()'>后一页</A>"; return thePage; } function UpPageGo(){ if(page>0) page--; getContent(); BodyText=""; } //当前的页数 function currentPage() { var cp; cp="当前是第 "+(page+1)+" 页"; return cp; } //总共的页数 function allPage() { var ap; ap='总共 '+(pagesNumber+1)+' 页'; return ap } function NextPageGo() { if (page<pagesNumber) page++; getContent(); BodyText=""; } //显示分页状态栏 function pageBar(page) { var pb; pb=UpPage(page)+" "+NextPage(page)+" "+currentPage()+" "+allPage()+selectPage(); return pb; } function changePage(tpage) { page=tpage if(page>=0) page--; if (page<pagesNumber) page++; getContent(); BodyText=""; } function selectPage() { var sp; sp="<select name='hehe' onChange='javascript:changePage(this.options[this.selectedIndex].value)'>"; //sp="<select name='hehe' onChange='alert(this.options[this.selectedIndex].value)'>"; sp=sp+"<option value=''></option>"; for (t=0;t<=pagesNumber;t++) { sp=sp+"<option value='"+t+"'>"+(t+1)+"</option>"; } sp=sp+"</select>" return sp; } function getContent() { if (!page) page=0; n=page*pagenum; endNum=(page+1)*pagenum; if (endNum>maxNum) endNum=maxNum; BodyText=header+BodyText; for (;n<endNum;n++) { BodyText=BodyText+"<TR>"; for (m=0;m<=colNum-1;m++) { mName=column.item(m).tagName; BodyText=BodyText+("<TD>"+xmlDoc.getElementsByTagName(mName).item(n).text+"</TD>"); } BodyText=BodyText+"</TR>" mm=""; } showhtml.innerHTML=BodyText+"</table>"+pageBar(page); BodyText="" } </script> <div id="showhtml"></div> <script> if (maxNum==0) { document.write("没有检索到合适的人才信息") } else { getContent() } </script> </BODY> </HTML> //下面是tt.xml的代码 <?xml version="1.0" encoding="GB2312"?> <rautinee> <member id='1'> <name>海仔</name> <loginName>rautinee</LOGinName> <email>rautinee@BTamail.net.cn</email></member> <member id='2'> <name>刚强</name> <loginName>hehe</loginName> <email>rautinee@chinamanagers.com</email></member> <member id='3'> <name>金华刚</name> <loginName>nature_it</loginName> <email>rautinee_sea@hotmail.com</email></member> <member id='4'> <name>的简强</name> <loginName>tank</loginName> <email>tank@163.com</email></member> <member id='7'> <name>合资</name> <loginName>kaka</loginName> <email>kaka@eyou.com</email></member> <member id='6'> <name>加个人</name> <loginName>apple</loginName> <email>apple@163.com</email></member> <member id='8'> <name>null</name> <loginName>sunny</loginName> <email>rautinee@eyou.com</email></member> <member id='10'> <name>宝贝</name> <loginName>index</loginName> <email>rautinee@21cn.com</email></member> <member id='12'> <name>null</name> <loginName>login</loginName> <email>webmaster@chinamanagers.com</email></member> <member id='13'> <name>jiang</name> <loginName>123</loginName> <email>japing@chianmanagers.com</email></member> <member id='14'> <name>null</name> <loginName>world</loginName> <email>rautinee@21cn.com</email></member> <member id='15'> <name>null</name> <loginName>swallow</loginName> <email>swallow@chinamanagers.com</email></member> <member id='16'> <name>魏格</name> <loginName>hotmail</loginName> <email>rautinee_sea@hotmail.com</email></member> <member id='17'> <name>null</name> <loginName>wrong</loginName> <email>wrong@chinamanagers.com</email></member> <member id='18'> <name>null</name> <loginName>leah</loginName> <email>leah@chinamanagers.com</email></member> <member id='19'> <name>null</name> <loginName>ttth</loginName> <email>rautinee@21cn.com</email></member> </rautinee>
目前好像是只支持>IE5.0
以上就是详细介绍如何使用javascript+xml实现分页的内容，更多相关内容请关注PHP中文网（www.php.cn）！
以上是脚本宝典为你收集整理的详细介绍如何使用javascript+xml实现分页全部内容，希望文章能够帮你解决详细介绍如何使用javascript+xml实现分页所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。