JAVASCRIPT分页(读取xml文件中的记录)

最近做一个网站,为了减少数据库的访问,将所有数据都建了个xml索引,前台页面中的数据都从xml文件中读取,但是为要实现新闻列表的分页不能使用asp.net的控件了,只好使用javascript来分页,代码如下:

var  xmlDoc;
var  nodeIndex;
var  pageIndex;
var  pageSize = 20 ;
var  lastPage;    // 最后一页
var  overSize ;    // 最后一页的记录数
var  listStr = '' ;
var  recordCount = 0 ;

function  getxmlDoc(path)     // 读取xml文件
... {
  document.getElementById("txtPageCount").readOnly=true;
  document.getElementById("txtRecordCount").readOnly=true;
  document.getElementById("txtCurrPage").readOnly=true;
  document.getElementById("txtCurrPageRecord").readOnly=true;
  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
    var currNode;
    xmlDoc.async=false;
    path="../news/"+path;
    xmlDoc.load(path);
    if(xmlDoc.parseError.errorCode!=0)
    ...{
        var myErr=xmlDoc.parseError;
        alert("出错！"+myErr.reason);
    }
    getRecordCount();
    if(recordCount<pageSize)
       onLast();
    else onFirst();
}
function  getRecordCount()              // 获得记录信息
... {
    var rootNode=xmlDoc.documentElement;
    recordCount=rootNode.childNodes.length;
    var pageCount=Math.ceil(recordCount/pageSize);
    document.getElementById("txtPageCount").value=pageCount;
    document.getElementById("txtRecordCount").value=recordCount;
    overSize=recordCount%pageSize;
    if(overSize>0)
    ...{
        lastPage=recordCount-overSize;
    }
    else
    ...{
        lastPage=recordCount-pageSize;
    }
}
function  getPageRecord(pageIndex,pageSize)            // 读取xml文件中的记录
... {
     clearRow("myTable"); 
    var rootNode= xmlDoc.documentElement;
    var currNode=rootNode.childNodes[pageIndex];
    listStr='<ul>';
    for(var i=pageIndex;i<pageIndex+pageSize&&i<rootNode.childNodes.length;i++)
    ...{
        var arr=new Array();
        var nNode= xmlDoc.documentElement.childNodes[i];  
        title=nNode.childNodes[0].text;    //标题
        time=nNode.childNodes[1].text;    
        time=time.substring(2,10);       //日期
        url=nNode.childNodes[2].text;    //URL
         //alert(title);
        listStr=listStr+'<li><a href="'+url+'">'+title+'</a><span class="list_time">&nbsp;&nbsp;['+time+']</span></li>';
    }   
   if(pageIndex>=lastPage)document.getElementById("btnnext").style.display="none";
      else document.getElementById("btnnext").style.display="";
   if(pageIndex==0)document.getElementById("btnprev").style.display="none";
   else document.getElementById("btnprev").style.display="";
    listStr=listStr+'</ul>';
    document.getElementById("myTable").innerHTML=listStr;
}
function  onFirst()                                                               // 当点击首页的时候触发
... {   
   if(recordCount<pageSize)
    ...{
      onLast();
      return;
    }
    pageIndex=0;
    var currIndex=pageIndex;
    getPageRecord(currIndex,pageSize);
    pageIndex=currIndex ;
    document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
    document.getElementById("txtCurrPageRecord").value=pageSize;
}
function  onPrev()                          // 点击上一页时触发
... {
    var currIndex=pageIndex;
    currIndex-=pageSize;
    getPageRecord(currIndex,pageSize)
    pageIndex=currIndex;
    document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
    document.getElementById("txtCurrPageRecord").value=pageSize;
   
}
function  onNext()                         // 点击下一页的时候触发
... {    
    var currIndex=pageIndex;
    currIndex+=pageSize;
    getPageRecord(currIndex,pageSize);
    pageIndex=currIndex;
    document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
    document.getElementById("txtCurrPageRecord").value=pageSize;
    
}
function  onLast()                   // 点击最后一页的时候触发
... {
    if(overSize>0)
    ...{
        getPageRecord(lastPage,overSize)
        document.getElementById("txtCurrPageRecord").value=overSize;
    }
    else
    ...{
        getPageRecord(lastPage,pageSize)
        document.getElementById("txtCurrPageRecord").value=pageSize;
    }    
    pageIndex=lastPage;
    document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
}
function  toPage()                             // 转向指定页
... {    
    var index=document.getElementById("txtCurrPage").value
    var currIndex=(index-1)*pageSize;      
    if(event.keyCode==13)
    ...{
         getPageRecord(currIndex,pageSize);
    }
    pageIndex=currIndex;
}

function  clearRow(obj)                        // 清除页面中的一个标记之间的内容
... {
 var table=document.getElementById(obj);
 var length=table.childNodes.length;  
 for(var i=length-1;i>0;i--)
 ...{
  table.removeChild(table.childNodes[i]);   
 }
}

以上是javascript脚本,下面是页面文件:

<% ... @ Page Language="C#"  %>

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html  xmlns ="http://www.w3.org/1999/xhtml"   >
< head  >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312"   />
< title > 通知公告 </ title >
< link  href ="../css/body.css"  rel ="stylesheet"  type ="text/css"  media ="screen"   />
< link  href ="../css/index_news_list.css"  rel ="stylesheet"  type ="text/css"  media ="screen"   />
< script  src ="../js/page.js"  type ="text/javascript"  language ="javascript"   ></ script >
</ head >
< body  onload ='getxmlDoc("notice_list.xml")' >
< div  id ="hd" >
< iframe  width ="100%"  height ="160"  frameborder =0  scrolling ="no"  src ="../nav.htm" ></ iframe >
</ div >
< div  id ="box"  style ="" >

< form  id ="myform"  action ="../search.aspx"  onsubmit  ="search_submit();return false;" >
     < div  style ="text-align:left;line-height:20px;height:20px;    " >
     < asp:SiteMapPath  ID ="SiteMapPath1"  runat ="server"  Font-Names ="宋体"  Font-Size ="12px"
            PathSeparator =" : "   >
             < PathSeparatorStyle  Font-Bold ="False"  ForeColor ="#990000"   />
             < CurrentNodeStyle  ForeColor ="#333333"   />
             < NodeStyle  Font-Bold ="False"  ForeColor ="#990000"   />
             < RootNodeStyle  Font-Bold ="False"  ForeColor ="#FF8000"   />
             < PathSeparatorTemplate >
                 &gt;&gt;
             </ PathSeparatorTemplate >
       </ asp:SiteMapPath >

     < input  name ="key"  style ="width:100px;margin-top:2px;height:16px;" />  
     < select  name ="search_type"  style ="width:80px;height:20px;" >
         < option  value ="1"  style ="height:50px;" > 标题 </ option >
         < option  value ="2" > 全文 </ option >
     </ select >
    
     < input  type ="submit"  value ="搜索"  style ="background-image:url(../media/btn_bg.gif);height:20px;border:0;width:59px;" />  
     </ div >
   </ form >
< hr  style ="color: #018C6F;"   />
< div  id ="left_side_div" >
  < ul >
  <!--  菜单条目 -->
     < li >< a  id ="current"  href ="news_notice_list.aspx" > 通知公告 </ a ></ li >
     < li >< a  href ="news_picnews_list.aspx" > 图片新闻 </ a ></ li >
     < li >< a  href ="keji_dongtai_list.aspx" > 科技动态 </ a ></ li >
     < li >< a  href ="keji_zixun_list.aspx" > 科技资讯 </ a ></ li >
     < li >< a  href ="news_policy_list.aspx" > 政策法规 </ a ></ li >
     < li >< a  href ="news_peixun_list.aspx" > 培训信息 </ a ></ li >
</ ul >
</ div >
< div  id ="right_side_div" >
< table  width ="475"  align ="left"   >
     < tr  width ="596" >
         < td  >
             < div  width ="100%"  id ="myTable" >            
             </ div >
         </ td >
     </ tr >
     < tr  >
         < td  style ="height: 19px;" >
         < div  id ="nav" >  每页20条 当前页
           < input  id ="txtCurrPageRecord"  type ="text"    onkeydown ="toPage()" /> 条
             共有 < input  id ="txtRecordCount"  type ="text"    onkeydown ="toPage()" /> 条
              < input  id ="btnFirst"  type ="button"  value ="首页"   onclick ="onFirst()"   />
              < input  id ="btnPrev"  type ="button"  value ="上一页"   onclick ="onPrev()"   />
              < input  id ="btnNext"  type ="button"  value ="下一页"   onclick ="onNext()"   />
              < input  id ="btnLast"  type ="button"  value ="末页"   onclick ="onLast()"   />
             第 < input  id ="txtCurrPage"    type ="text"    onkeydown ="toPage()" /> /
              < input   id ="txtPageCount" type ="text"  onkeydown ="toPage()" />
             页
         </ div >
         </ td >
   </ tr >      
</ table >
  </ div >
</ div >
< div  id ="ft" >
< iframe  width ="100%"  height ="80"  frameborder =0  scrolling ="no"  src ="../foot.htm" ></ iframe >
</ div >

</ body >
</ html >

xml文件格式如下:

 

<? xml version="1.0" standalone="yes" ?>
< NewDataSet >
   < news >
     < title > 合肥工业大学 </ title >
     < time > 2007-04-18T00:00:00+08:00 </ time >
     < url > txtfile/20070426221413.htm </ url >
   </ news >
   < news >
     < title > 合肥工业大学计算机 </ title >
     < time > 2007-04-27T00:00:00+08:00 </ time >
     < url > notice/20070427184855.htm </ url >
   </ news >
   < news >
     < title > 计算机2班 </ title >
     < time > 2007-04-17T00:00:00+08:00 </ time >
     < url > notice/20070427193529.htm </ url >
   </ news >
   < news >
     < title > ssssss </ title >
     < time > 2007-04-11T00:00:00+08:00 </ time >
     < url > notice/20070427220218.htm </ url >
   </ news >
</ NewDataSet >

请大家指点!!谢谢