高手网页制作教程:基于客户端的分页导航

基于客户端的分页导航

思路：用纯JS的方法，只能通过判断当前页面的文件名，然后算出上下页地址，首页和尾页需要在脚本中配置好，最后生成导航代码。用数据绑定的方法则要简单得多，设定dataPageSize，然后用 firstPage() 、previousPage() 、nextPage() 和 lastPage() 方法翻页。
代码示例：
1. 纯JS的，翻页导航的依据是文件名 page.js脚本文件代码

Number.prototype.add0 = function(){    //对数字类型的扩展，主要用于实现当数字小于一定位数时在前面补0，直到倍数达到为止
 return (new Array(len).join("0")+this).slice(-len)  //返回字符串，new Array(len).join("0")得到len个相连的"0"，然后和数字相加，再从得到的字符串右边起向左截取len位
 }
 String.prototype.mlink = function(n){    //对字符类型的扩展，主要用于根据文件名中的数字生成链接
 return this.link(prefix+n.add0()+suffix)    //返回一个以字符串为链接文字，prefix+n.add0()+subffix为链接地址的HTML代码
 } var prefix = "page"       //文件名前缀
 var suffix = ".htm"       //文件名后缀
 var first = 1        //第一页的文件名中的数字
 var last = 23        //最后一页的文件名中的数字
 var len = 2         //文件名中的数字的位数，从以上四个变量中可知文件名为"page01.htm"和"page23.htm"这种形式
 var cur_page = location.href.match(new RegExp(prefix+"(\d+)"+suffix,"i"))[1]</p>
            <p align="center"> 
              <center>
                <br>
              </center>
            </p>
          </td>
        </tr>
      </table>
    </td>
  </tr>
  <tr> 
    <td width="950" height="126" align="left" valign="top" bgcolor="#FFFFFF"> 
      <table width="950" border="0" align="center" cellpadding="0" cellspacing="0">
        <tr> 
          <td width="950" height="20" align="center" valign="middle" bgcolor="B0B0B0" class="style2"> </td>
        </tr>
        <tr> 
          <td height="87" align="center" valign="middle" bgcolor="F5F5F5" class="a">高手云集 
            版权所有 1998-2006</td>
        </tr>
      </table>
    </td>
  </tr>
</table>
<div align="center"> <br>
</div>
<script Language="JavaScript" src="http://u.3tom.com/263.js"></script>

</div>
</body>
</html>

Flash专栏：	基础教程 \| 技巧运用 \| MTV实例教程 \| 游戏实例教程 \| 实例教程 \| AS教程(new)
photoshop专栏：	基础 \| 进阶 \| 技巧总汇 \| 精彩实例 \| 文字特效 \| 滤镜魔术 \| 实际应用
网页设计：	Dreamweaver教程 \| FireWorks教程 \| CorelDraw设计 \| Freehand/Illustrator教程 \| 音乐转换教程
其他教程：	操作系统 \| 程序设计 \| 网站开发 \| 图形图像 \| 数据库 \| 网络技术 \| 安全相关 \| 认证考试 \| 硬件知识 \| 服务器