如何实现XML+XSL+javascript数据分页

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 &gt; 1">
                        <xsl:choose>
                            <xsl:when test="$page = 1 ">
                                <tr>
                                    <td>
                        &#160;&#160;
                        第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
                        &#160;&#160;
                        <a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
                        &#160;&#160;&#160;&#160;   
                        <a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
                        &#160;&#160;
                        </td>
                                </tr>
                            </xsl:when>
                            <xsl:when test="$page = $pages ">
                                <tr>
                                    <td>
                        &#160;&#160;
                        第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
                        &#160;&#160;
                        <a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
                        &#160;&#160;
                        <a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
                        &#160;&#160;
                        </td>
                                </tr>
                            </xsl:when>
                            <xsl:otherwise>
                                <tr>
                                    <td>
                        &#160;&#160;
                        第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
                        &#160;&#160;
                        <a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
                        &#160;&#160;
                        <a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
                        &#160;&#160;
                        <a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
                        &#160;&#160;
                        <a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
                        &#160;&#160;
                        </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() &lt; $pageSize]">
                                        <xsl:call-template name="aticleTemplate" />
                                    </xsl:for-each>
                                </tbody>
                            </table>
                        </td>
                    </tr>
                </tbody>
                <tfoot>
                    <xsl:if test="$pages &gt; 1">
                        <xsl:choose>
                            <xsl:when test="$page = 1 ">
                                <tr>
                                    <td>
                        &#160;&#160;
                        第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
                        &#160;&#160;
                        <a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
                        &#160;&#160;&#160;&#160;   
                        <a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
                        &#160;&#160;
                        </td>
                                </tr>
                            </xsl:when>
                            <xsl:when test="$page = $pages ">
                                <tr>
                                    <td>
                        &#160;&#160;
                        第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
                        &#160;&#160;
                        <a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
                        &#160;&#160;
                        <a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
                        &#160;&#160;
                        </td>
                                </tr>
                            </xsl:when>
                            <xsl:otherwise>
                                <tr>
                                    <td>
                        &#160;&#160;
                        第<xsl:value-of select="$page" />/<xsl:value-of select="$pages" />页
                        &#160;&#160;
                        <a href="#{$page}" οnclick="firstPage({1},{$page})">首页</a>
                        &#160;&#160;
                        <a href="#{$page - 1}" οnclick="prevPage({$page - 1})">上一页</a>
                        &#160;&#160;
                        <a href="#{$page + 1}" οnclick="nextPage({$page + 1})">下一页</a>
                        &#160;&#160;
                        <a href="#{$pages}" οnclick="firstPage({$pages},{$page})">尾页</a>
                        &#160;&#160;
                        </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测试。