JS功能脚本
function nextPage(num){
document.getElementById("content"+num).style.display="block";
num--;
document.getElementById("content"+num).style.display="none";
}
function prevPage(num){
document.getElementById("content"+num).style.display="block";
num++;
document.getElementById("content"+num).style.display="none";
}
function firstPage(num,currPage)
{
document.getElementById("content"+num).style.display="block";
document.getElementById("content"+currPage).style.display="none";
}
function onInitialize(){
var i = 1;
document.getElementById("content"+i).style.display = "block";
}
数据分页模版
<?xml version="1.0" encoding="UTF-8" ?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:param name="pageSize" select="2" />
<xsl:template match="/guestbook">
<h3>留言列表</h3>
<xsl:apply-templates select="article[position() mod $pageSize = 1 ]">
<xsl:with-param name="pages" select="ceiling(count(article) div $pageSize)" />
<xsl:sort select="datadate" order="descending" />
</xsl:apply-templates>
</xsl:template>
<xsl:template match="article">
<xsl:param name="pages" />
<xsl:variable name="page" select="position()" />
<div id="content{$page}" style="display:'none'" title="content{$page}">
<table>
<thead>
<xsl:if test="$pages > 1">
<xsl:choose>
<xsl:when test="$page = 1 ">
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
    
<a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
  
</td>
</tr>
</xsl:when>
<xsl:when test="$page = $pages ">
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
  
<a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
  
</td>
</tr>
</xsl:when>
<xsl:otherwise>
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
  
<a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
  
<a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
  
<a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
  
</td>
</tr>
</xsl:otherwise>
</xsl:choose>
</xsl:if>
</thead>
<tbody>
<tr>
<td>
<table border="1">
<tbody>
<xsl:for-each select="self::article | following-sibling::article[position() < $pageSize]">
<xsl:call-template name="aticleTemplate" />
</xsl:for-each>
</tbody>
</table>
</td>
</tr>
</tbody>
<tfoot>
<xsl:if test="$pages > 1">
<xsl:choose>
<xsl:when test="$page = 1 ">
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
    
<a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
  
</td>
</tr>
</xsl:when>
<xsl:when test="$page = $pages ">
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
  
<a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
  
</td>
</tr>
</xsl:when>
<xsl:otherwise>
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
  
<a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
  
<a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
  
<a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
  
</td>
</tr>
</xsl:otherwise>
</xsl:choose>
</xsl:if>
</tfoot>
</table>
</div>
</xsl:template>
<xsl:template name="aticleTemplate">
<table>
<tbody>
<xsl:choose>
<xsl:when test="position() mod 2 = 1">
<tr bgcolor="#cccccc">
<th align="left" width="50">作者</th>
<th align="left" width="50">
<xsl:value-of select="author" />
</th>
<th align="left" width="100">发表时间</th>
<th align="left" width="50">
<xsl:value-of select="datadate" />
</th>
</tr>
<tr bgcolor="#cccccc">
<td colspan="4">
<xsl:value-of select="content" />
</td>
</tr>
</xsl:when>
<xsl:otherwise>
<tr>
<th align="left" width="50">作者</th>
<th align="left" width="50">
<xsl:value-of select="author" />
</th>
<th align="left" width="100">发表时间</th>
<th align="left" width="50">
<xsl:value-of select="datadate" />
</th>
</tr>
<tr>
<td colspan="4">
<xsl:value-of select="content" />
</td>
</tr>
</xsl:otherwise>
</xsl:choose>
</tbody>
</table>
</xsl:template>
</xsl:stylesheet>
数据文件
<?xml version="1.0" encoding="gb2312"?>
<guestbook>
<article id="73a7a287-aef6-4d35-ac2c-638ca3233be6">
<author>guest</author>
<datadate>20060812</datadate>
<content>asdfsad</content>
</article>
<article id="84957008-4cb4-4c96-bafa-775dd33e10cf">
<author>guest</author>
<datadate>20060812</datadate>
<content>fffff</content>
</article>
<article id="91426bb3-3bbf-4176-be66-c92cb79bb171">
<author>guest</author>
<datadate>20060812</datadate>
<content>fffff</content>
</article>
<article id="8e3bda3f-7d6e-4ae3-af0a-740a884cbf06">
<author>guest</author>
<datadate>20060812</datadate>
<content>asdf</content>
</article>
<article id="d6528172-cd03-4333-bb42-0121effca2ff">
<author>guest</author>
<datadate>20060812</datadate>
<content>asdf</content>
</article>
<article id="cd30a893-f0aa-44be-b56b-32a1aa44717a">
<author>guest</author>
<datadate>20060812</datadate>
<content>asdf</content>
</article>
<article id="b47ca7e6-93e0-4992-97fa-78ea557b0252">
<author>guest</author>
<datadate>20060812</datadate>
<content>asdf</content>
</article>
<article id="2070cb5d-e225-46f5-95ca-3dea33f9d42f">
<author>guest</author>
<datadate>20060812</datadate>
<content>aa</content>
</article>
</guestbook>
由于前面已经介绍了如何通过JS+XSL将XML转换为HTML故这里将不再坳述。读者只需要读懂分页模版文件即可。
文章所提供代码均已经通过IE5/Firefox1.x测试。
function nextPage(num){
document.getElementById("content"+num).style.display="block";
num--;
document.getElementById("content"+num).style.display="none";
}
function prevPage(num){
document.getElementById("content"+num).style.display="block";
num++;
document.getElementById("content"+num).style.display="none";
}
function firstPage(num,currPage)
{
document.getElementById("content"+num).style.display="block";
document.getElementById("content"+currPage).style.display="none";
}
function onInitialize(){
var i = 1;
document.getElementById("content"+i).style.display = "block";
}
数据分页模版
<?xml version="1.0" encoding="UTF-8" ?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:param name="pageSize" select="2" />
<xsl:template match="/guestbook">
<h3>留言列表</h3>
<xsl:apply-templates select="article[position() mod $pageSize = 1 ]">
<xsl:with-param name="pages" select="ceiling(count(article) div $pageSize)" />
<xsl:sort select="datadate" order="descending" />
</xsl:apply-templates>
</xsl:template>
<xsl:template match="article">
<xsl:param name="pages" />
<xsl:variable name="page" select="position()" />
<div id="content{$page}" style="display:'none'" title="content{$page}">
<table>
<thead>
<xsl:if test="$pages > 1">
<xsl:choose>
<xsl:when test="$page = 1 ">
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
    
<a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
  
</td>
</tr>
</xsl:when>
<xsl:when test="$page = $pages ">
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
  
<a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
  
</td>
</tr>
</xsl:when>
<xsl:otherwise>
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
  
<a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
  
<a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
  
<a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
  
</td>
</tr>
</xsl:otherwise>
</xsl:choose>
</xsl:if>
</thead>
<tbody>
<tr>
<td>
<table border="1">
<tbody>
<xsl:for-each select="self::article | following-sibling::article[position() < $pageSize]">
<xsl:call-template name="aticleTemplate" />
</xsl:for-each>
</tbody>
</table>
</td>
</tr>
</tbody>
<tfoot>
<xsl:if test="$pages > 1">
<xsl:choose>
<xsl:when test="$page = 1 ">
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
    
<a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
  
</td>
</tr>
</xsl:when>
<xsl:when test="$page = $pages ">
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
  
<a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
  
</td>
</tr>
</xsl:when>
<xsl:otherwise>
<tr>
<td>
  
第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
  
<a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
  
<a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
  
<a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
  
<a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
  
</td>
</tr>
</xsl:otherwise>
</xsl:choose>
</xsl:if>
</tfoot>
</table>
</div>
</xsl:template>
<xsl:template name="aticleTemplate">
<table>
<tbody>
<xsl:choose>
<xsl:when test="position() mod 2 = 1">
<tr bgcolor="#cccccc">
<th align="left" width="50">作者</th>
<th align="left" width="50">
<xsl:value-of select="author" />
</th>
<th align="left" width="100">发表时间</th>
<th align="left" width="50">
<xsl:value-of select="datadate" />
</th>
</tr>
<tr bgcolor="#cccccc">
<td colspan="4">
<xsl:value-of select="content" />
</td>
</tr>
</xsl:when>
<xsl:otherwise>
<tr>
<th align="left" width="50">作者</th>
<th align="left" width="50">
<xsl:value-of select="author" />
</th>
<th align="left" width="100">发表时间</th>
<th align="left" width="50">
<xsl:value-of select="datadate" />
</th>
</tr>
<tr>
<td colspan="4">
<xsl:value-of select="content" />
</td>
</tr>
</xsl:otherwise>
</xsl:choose>
</tbody>
</table>
</xsl:template>
</xsl:stylesheet>
数据文件
<?xml version="1.0" encoding="gb2312"?>
<guestbook>
<article id="73a7a287-aef6-4d35-ac2c-638ca3233be6">
<author>guest</author>
<datadate>20060812</datadate>
<content>asdfsad</content>
</article>
<article id="84957008-4cb4-4c96-bafa-775dd33e10cf">
<author>guest</author>
<datadate>20060812</datadate>
<content>fffff</content>
</article>
<article id="91426bb3-3bbf-4176-be66-c92cb79bb171">
<author>guest</author>
<datadate>20060812</datadate>
<content>fffff</content>
</article>
<article id="8e3bda3f-7d6e-4ae3-af0a-740a884cbf06">
<author>guest</author>
<datadate>20060812</datadate>
<content>asdf</content>
</article>
<article id="d6528172-cd03-4333-bb42-0121effca2ff">
<author>guest</author>
<datadate>20060812</datadate>
<content>asdf</content>
</article>
<article id="cd30a893-f0aa-44be-b56b-32a1aa44717a">
<author>guest</author>
<datadate>20060812</datadate>
<content>asdf</content>
</article>
<article id="b47ca7e6-93e0-4992-97fa-78ea557b0252">
<author>guest</author>
<datadate>20060812</datadate>
<content>asdf</content>
</article>
<article id="2070cb5d-e225-46f5-95ca-3dea33f9d42f">
<author>guest</author>
<datadate>20060812</datadate>
<content>aa</content>
</article>
</guestbook>
由于前面已经介绍了如何通过JS+XSL将XML转换为HTML故这里将不再坳述。读者只需要读懂分页模版文件即可。
文章所提供代码均已经通过IE5/Firefox1.x测试。