共有两个文件tmh.htm & tt.xml
源代码如下：
tmh.htm
___________________________________________________
<!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实现分页的内容。