動(dòng)機(jī)：
為了方便用戶查看大批量數(shù)據(jù)，我們會(huì)用到動(dòng)態(tài)分頁(yè)，因此分頁(yè)功能是我們?cè)诰W(wǎng)站上見(jiàn)過(guò)的最普遍也是最常用的一個(gè)功能模塊了。而以往的信息分頁(yè)都是連接到數(shù)據(jù)庫(kù)的，每一次點(diǎn)擊都必須要后臺(tái)數(shù)據(jù)庫(kù)的支持。這樣不但服務(wù)器的負(fù)擔(dān)加重，而且嚴(yán)重的影響用戶瀏覽的速度.
試想，如果把分頁(yè)的功能放到客戶端，那會(huì)產(chǎn)生什么樣的效果呢？呵呵，看看下面的設(shè)計(jì)吧！ 。
材料：
XML卷之動(dòng)態(tài)分頁(yè)
有2個(gè)文件：pages.xml 和 pages.xsl
作用：
把分頁(yè)的功能放到客戶端。在不刷新頁(yè)面的情況下對(duì)數(shù)據(jù)進(jìn)行過(guò)濾篩選，有效的提高瀏覽數(shù)據(jù)功能的效率。
效果：
瀏覽這里
代碼：
pages.xml
?xml version="1.0" encoding="gb2312" ?>
?xml-stylesheet type="text/xsl" href="pages.xsl" ?>
BlueIdea>
team>
blue_ID>1/blue_ID>
blue_name>Sailflying/blue_name>
blue_text>一個(gè)簡(jiǎn)單的分頁(yè)/blue_text>
blue_time>2002-1-11 17:35:33/blue_time>
blue_class>XML專題/blue_class>
/team>
team>
blue_ID>2/blue_ID>
blue_name>flyingbird/blue_name>
blue_text>嫁給你，是要你疼的/blue_text>
blue_time>2001-09-06 12:45:51/blue_time>
blue_class>灌水精華/blue_class>
/team>
team>
blue_ID>3/blue_ID>
blue_name>苛子/blue_name>
blue_text>正則表達(dá)式在ＵＢＢ論壇中的應(yīng)用/blue_text>
blue_time>2001-11-23 21:02:16/blue_time>
blue_class>Web 編程精華/blue_class>
/team>
team>
blue_ID>4/blue_ID>
blue_name>太乙郎/blue_name>
blue_text>年末經(jīng)典分舵聚會(huì)完全手冊(cè) v0.1/blue_text>
blue_time>2000-12-08 10:22:48/blue_time>
blue_class>論壇灌水區(qū)/blue_class>
/team>
team>
blue_ID>5/blue_ID>
blue_name>mmkk/blue_name>
blue_text>Asp錯(cuò)誤信息總匯/blue_text>
blue_time>2001-10-13 16:39:05/blue_time>
blue_class>javascript腳本/blue_class>
/team>
/BlueIdea>
pages.xsl
?xml version="1.0" encoding="gb2312" ?>
xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">
xsl:template match="/">
html>
head>
title> XML卷之實(shí)戰(zhàn)錦囊（3）：動(dòng)態(tài)分頁(yè)/title>
style>
body,BlueIdea,team,blue_ID,blue_name,blue_text,blue_time,blue_class{ font: 12px "宋體", "Arial", "Times New Roman"; }
table { font-size: 12px; border: 0px double; border-color: #99CC99 #99CC99 #CCCCCC #CCCCCC; cellpadding:3;cellspacing:3; bgcolor:#eeeeee; text-decoration: blink}
span { font-size: 12px; color: red; }
.keybutton { cursor:hand; font-size: 12px; color: #003300; background: #ffffff; border: 0px solid;}
/style>
script>
xsl:comment>
![CDATA[
var OnePageNum=2;
var PageNum=1;
var XMLPageNum=1;
function pages(Num)
{
stylesheet=document.XSLDocument;
source=document.XMLDocument;
nodes=source.documentElement.childNodes;
len=nodes.length;
for(i=1;i=(len/OnePageNum);i++);
XMLPageNum=i;
var firstNum=0;
var lastNume=0;
if (Num=="first") {PageNum=1;}
if (Num=="previous") {if (PageNum>1) PageNum -=1;}
if (Num=="next") {if (PageNumXMLPageNum) PageNum +=1;}
if (Num=="last") {PageNum =XMLPageNum;}
sortField=document.XSLDocument.selectSingleNode("http://@expr");
firstNum=OnePageNum*(PageNum-1)+1;
lastNum=OnePageNum*(PageNum-1)+OnePageNum;
text="childnumber(this)>="+firstNum+" childnumber(this)="+lastNum;
sortField.value=text;
Layer1.innerHTML=source.documentElement.transformNode(stylesheet);
}
]]>
/xsl:comment>
/script>
/head>
body>
p align="center">span>XML卷之實(shí)戰(zhàn)錦囊（3）：動(dòng)態(tài)分頁(yè)/span>/p>
table align="center" width="500" >
tr>
td>
button id="cmdfirstPage" class="keybutton" onclick="pages('first');" >首頁(yè)/button>
button id="cmdpreviousPage" class="keybutton" onclick="pages('previous');" >上一頁(yè)/button>
button id="cmdnextPage" class="keybutton" onclick="pages('next');">下一頁(yè)/button>
button id="cmdlastPage" class="keybutton" onclick="pages('last');">尾頁(yè)/button>
/td>
/tr>
/table>
div id="Layer1" name="Layer1"> xsl:apply-templates select="BlueIdea" />/div>
/body>
/html>
/xsl:template>
xsl:template match="BlueIdea">
table width="500" border="1" align="center" cellpadding="1" cellspacing="1" bordercolordark="#ffffff" bordercolorlight="#ADAAAD">
tr bgcolor="#FFCC99" align="center">
td>編號(hào)/td>
td>姓名/td>
td>主題/td>
td>發(fā)表時(shí)間/td>
td>歸類/td>
/tr>
xsl:apply-templates select="team" order-by="blue_ID"/>
/table>
/xsl:template>
xsl:template match="team">
xsl:if expr="childnumber(this)gt;=1 childnumber(this)lt;=2 ">
tr align="center">
xsl:apply-templates select="blue_ID" />
xsl:apply-templates select="blue_name" />
xsl:apply-templates select="blue_text" />
xsl:apply-templates select="blue_time" />
xsl:apply-templates select="blue_class" />
/tr>
/xsl:if>
/xsl:template>
xsl:template match="blue_ID">
td bgcolor="#eeeeee">
xsl:value-of />
/td>
/xsl:template>
xsl:template match="blue_name">
td>
xsl:value-of />
/td>
/xsl:template>
xsl:template match="blue_text">
td>
xsl:value-of />
/td>
/xsl:template>
xsl:template match="blue_time">
td>
xsl:value-of />
/td>
/xsl:template>
xsl:template match="blue_class">
td>
xsl:value-of />
/td>
/xsl:template>
/xsl:stylesheet>
講解：
1）search.xml 是數(shù)據(jù)文件，相信大家都不會(huì)有問(wèn)題。
2）search.xsl 是格式文件，有幾個(gè)地方要注意。
（1）腳本中：
nodes=source.documentElement.childNodes;
作用是：找到所有的節(jié)點(diǎn)。nodes.length就是符合條件的總節(jié)點(diǎn)數(shù)
sortField=document.XSLDocument.selectSingleNode("http://@expr");
作用是：找到有屬性為expr的第一個(gè)節(jié)點(diǎn)，因此它對(duì)應(yīng)的節(jié)點(diǎn)就是
xsl:if expr="childnumber(this)gt;=1 childnumber(this)lt;=2 ">
因此在初次onLoad的時(shí)候expr的value值是
childnumber(this)=1 childnumber(this)>=2
關(guān)于 gt; lt; 大家可能熟悉多了。那是什么呢？ 它就是“與”了.
大家可以在XML的書中找到其它的一些。
參數(shù)說(shuō)明：
OnePageNum：每頁(yè)顯示的數(shù)據(jù)數(shù)
PageNum：當(dāng)前頁(yè)數(shù)
XMLPageNum：總頁(yè)數(shù)
firstNum:當(dāng)前頁(yè)的第一條數(shù)據(jù)值
lastNum：當(dāng)前頁(yè)的最后一條數(shù)據(jù)值
（2）文本中：
xsl:if expr="childnumber(this)gt;=1 childnumber(this)lt;=2 ">
在分頁(yè)中我們需要輸出合適的數(shù)據(jù)，，因此我們用一個(gè) if 判斷條件來(lái)控制。
在初始的時(shí)候我們要求只輸出最前的兩個(gè)節(jié)點(diǎn)的數(shù)值。
childnumber(this)
作用：返回當(dāng)前節(jié)點(diǎn)在它的上級(jí)節(jié)點(diǎn)列表中的編號(hào)，列表中的第一個(gè)節(jié)點(diǎn)默認(rèn)編號(hào)為1。
在分頁(yè)中我們就是根據(jù)節(jié)點(diǎn)的編號(hào)來(lái)判斷它屬于第幾頁(yè)。
expr
不知道大家發(fā)現(xiàn)沒(méi)有，前兩次我們用到的都是 test ,可這個(gè)我們用的卻是expr。
它們之間有一定的區(qū)別，用法也不相同。
expr ── 腳本語(yǔ)言表達(dá)式，計(jì)算結(jié)果為"真"或"假"；如果結(jié)果為"真"，且通過(guò)test，則在輸出中顯示其中內(nèi)容（可省略此項(xiàng)屬性）。
test ── 源數(shù)據(jù)測(cè)試條件。
button id="cmdfirstPage" class="keybutton" onclick="pages('first');" >首頁(yè)/button>
作用是讓數(shù)據(jù)回到最前一頁(yè)。其它按鈕的作用類似。
補(bǔ)充一點(diǎn)： XML例子文件的使用方法
1）將每個(gè)例子里的兩個(gè)文件按照文件名分別保存。
2）用瀏覽器瀏覽XML文件即可。這是你會(huì)看到效果，應(yīng)該不錯(cuò)吧！
后記：
呵呵，可以增加動(dòng)態(tài)排序后，再分頁(yè)的功能。再把列表數(shù)變?yōu)榭稍O(shè)置。發(fā)揮你的思維，讓這些功能更加完美。大家可以研究出更好的方法來(lái)實(shí)現(xiàn)分頁(yè)功能?；ハ嗵接?，不亦樂(lè)乎！
