投稿获客
  1. 创想鸟首页
  2. 用户投稿

XML实战秘籍第三卷：动态分页

程序猿 • • 用户投稿 • 阅读 0

[导读] 为了方便用户查看大批量数据，我们会用到动态分页，因此分页功能是我们在网站上见过的最普遍也是最常用的一个功能模块了。而以往的信息分页都是连接到数据库的，每一次点击都必须要后台数据库的支持。这样不但服

为了方便用户查看大批量数据，我们会用到动态分页，因此分页功能是我们在网站上见过的最普遍也是最常用的一个功能模块了。而以往的信息分页都是连接到数据库的，每一次点击都必须要后台数据库的支持。这样不但服务器的负担加重，而且严重的影响用户浏览的速度.
试想，如果把分页的功能放到客户端，那会产生什么样的效果呢？呵呵，看看下面的设计吧！ 。

材料：
xml卷之动态分页
有2个文件：pages.xml 和 pages.xsl

作用：
把分页的功能放到客户端。在不刷新页面的情况下对数据进行过滤筛选，有效的提高浏览数据功能的效率。
效果：
浏览这里
代码：
pages.xml

      1    Sailflying    一个简单的分页    2002-1-11 17:35:33    XML专题        2    flyingbird    嫁给你，是要你疼的    2001-09-06 12:45:51    灌水精华        3    苛子    正则表达式在ＵＢＢ论坛中的应用    2001-11-23 21:02:16    Web 编程精华        4    太乙郎    年末经典分舵聚会完全手册 v0.1    2000-12-08 10:22:48    论坛灌水区        5    mmkk    asp错误信息总汇    2001-10-13 16:39:05    javascript脚本

pages.xsl

 XML卷之实战锦囊（3）：动态分页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;}  <![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;i1) PageNum -=1;} if (Num=="next") {if (PageNum="+firstNum+" & childnumber(this)  
XML卷之实战锦囊（3）：动态分页
 
 
     
 
 
 
 
编号姓名主题发表时间归类
=1 & childnumber(this)

讲解：
1）search.xml 是数据文件，相信大家都不会有问题。
2）search.xsl 是格式文件，有几个地方要注意。

（1）脚本中：

nodes=source.documentElement.childNodes;
作用是：找到所有的节点。nodes.length就是符合条件的总节点数

sortField=document.XSLDocument.selectSingleNode(“//@expr”);
作用是：找到有属性为expr的第一个节点，因此它对应的节点就是
<if expr="childnumber(this)youjiankuohaophpcn=1 & childnumber(this)
因此在初次onLoad的时候expr的value值是
childnumber(this)=2
关于 > < 大家可能熟悉多了。那&是什么呢？ 它就是“与”了.
大家可以在XML的书中找到其它的一些。

参数说明：
OnePageNum：每页显示的数据数
PageNum：当前页数
XMLPageNum：总页数
firstNum:当前页的第一条数据值
lastNum：当前页的最后一条数据值

（2）文本中：

=1 & childnumber(this)
在分页中我们需要输出合适的数据，，因此我们用一个 if 判断条件来控制。
在初始的时候我们要求只输出最前的两个节点的数值。

childnumber(this)
作用：返回当前节点在它的上级节点列表中的编号，列表中的第一个节点默认编号为1。
在分页中我们就是根据节点的编号来判断它属于第几页。
expr
不知道大家发现没有，前两次我们用到的都是 test ,可这个我们用的却是expr。
它们之间有一定的区别，用法也不相同。
expr ── 脚本语言表达式，计算结果为”真”或”假”；如果结果为”真”，且通过test，则在输出中显示其中内容（可省略此项属性）。
test ── 源数据测试条件。


作用是让数据回到最前一页。其它按钮的作用类似。

补充一点： XML例子文件的使用方法

1）将每个例子里的两个文件按照文件名分别保存。
2）用浏览器浏览XML文件即可。这是你会看到效果，应该不错吧！                        

以上就是 XML实战秘籍第三卷：动态分页的详细内容，更多请关注php中文网其它相关文章！

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1428963.html

赞 (0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
0 0

关于作者

程序猿的头像

程序猿签约作者

414.1K 文章
0 评论
2 粉丝
这个人很懒，什么都没有留下～
上一篇 2025年12月17日 01:48:59
详细介绍XML与JSON相互转换（图文）
下一篇 2025年12月17日 01:49:47

相关推荐

  • HTML 和 CSS 中的“联系我们”页面 用户投稿

    HTML 和 CSS 中的“联系我们”页面

    开发者您好！在本教程中，我将向您展示如何使用 html 和 css 创建现代的联系我们页面。联系我们表单是指网页表单的一部分，用户可以在其中向指定人员或网站管理员发送消息。 主要特点 响应式设计：布局灵活，适合移动和平板设备。现代 UI 元素：其中添加了图标、阴影和按钮悬停效果。 此联系表格完全响应…

    程序猿的头像 程序猿
    2025年12月24日
    700
  • HTML、CSS 和 JavaScript 中的简单侧边栏菜单 用户投稿

    HTML、CSS 和 JavaScript 中的简单侧边栏菜单

    构建一个简单的侧边栏菜单是一个很好的主意，它可以为您的网站添加有价值的功能和令人惊叹的外观。 侧边栏菜单对于客户找到不同项目的方式很有用，而不会让他们觉得自己有太多选择，从而创造了简单性和秩序。 今天，我将分享一个简单的 HTML、CSS 和 JavaScript 源代码来创建一个简单的侧边栏菜单。…

    程序猿的头像 程序猿
    2025年12月24日
    600
  • 带有 HTML、CSS 和 JavaScript 工具提示的响应式侧边导航栏 用户投稿

    带有 HTML、CSS 和 JavaScript 工具提示的响应式侧边导航栏

    响应式侧边导航栏不仅有助于改善网站的导航，还可以解决整齐放置链接的问题，从而增强用户体验。通过使用工具提示，可以让用户了解每个链接的功能，包括设计紧凑的情况。 在本教程中，我将解释使用 html、css、javascript 创建带有工具提示的响应式侧栏导航的完整代码。 对于那些一直想要一个干净、简…

    程序猿的头像 程序猿
    2025年12月24日
    500
  • css怎么设置超出显示省略号 用户投稿

    css怎么设置超出显示省略号

    css设置超出显示省略号的方法：1、使用“overflow:hidden;”语句把超出的部分隐藏起来；2、使用“text-overflow:ellipsis;”语句在文本溢出包含元素时，显示省略符号来代表被隐藏的部分。 本教程操作环境：windows7系统、CSS3&&HTML5版、…

    程序猿的头像 程序猿
    2025年12月24日
    900
  • 网页设计css样式代码大全，快来收藏吧！ 用户投稿

    网页设计css样式代码大全，快来收藏吧！

    减少很多不必要的代码，html+css可以很方便的进行网页的排版布局。小伙伴们收藏好哦~ 一.文本设置    1、font-size: 字号参数  2、font-style: 字体格式 3、font-weight: 字体粗细 4、颜色属性 立即学习“前端免费学习笔记（深入）”； color: 参数 …

    程序猿的头像 程序猿
    2025年12月24日
    700
  • css中id选择器和class选择器有何不同 用户投稿

    css中id选择器和class选择器有何不同

    之前的文章《什么是CSS语法？详细介绍使用方法及规则》中带了解CSS语法使用方法及规则。下面本篇文章来带大家了解一下CSS中的id选择器与class选择器，介绍一下它们的区别，快来一起学习吧！！ id选择器和class选择器介绍 CSS中对html元素的样式进行控制是通过CSS选择器来完成的，最常用…

    程序猿的头像 程序猿
    2025年12月24日
    700

  • CSS语言入门视频教程推荐

    CSS语言入门视频教程推荐CSS语言入门视频教程推荐CSS语言入门视频教程推荐CSS语言入门视频教程推荐

    html和css是组成web前端开发最核心的部分。在网页制作时使用css，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。那么css语言入门？如何学习？今天创想鸟在这里给大家推荐8个css免费经典视频教程供大家学习，希望对大家有所帮助。 1、《CSS视频教程-玉女心经版》 ht…

    程序猿的头像 程序猿
    2025年12月24日 • 用户投稿
    000

  • php约瑟夫问题如何解决

    “约瑟夫环”是一个数学的应用问题：一群猴子排成一圈，按1,2,…,n依次编号。然后从第1只开始数，数到第m只,把它踢出圈，从它后面再开始数， 再数到第m只，在把它踢出去…，如此不停的进行下去， 直到最后只剩下一只猴子为止，那只猴子就叫做大王。要求编程模拟此过程，输入m、n, 输出最后那个大王的编号。…

    程序猿的头像 程序猿
    用户投稿 2025年12月24日
    000

  • CSS新手整理的有关CSS使用技巧

    [导读]  1、不要使用过小的图片做背景平铺。这就是为何很多人都不用 1px 的原因，这才知晓。宽高 1px 的图片平铺出一个宽高 200px 的区域，需要 200*200=40, 000 次，占用资源。  2、无边框。推荐的写法是     1、不要使用过小的图片做背景平铺。这就是为何很多人都不用 …

    程序猿的头像 程序猿
    用户投稿 2025年12月23日
    000

  • CSS中实现图片垂直居中方法详解

    [导读] 在曾经的 淘宝ued 招聘 中有这样一道题目：“使用纯css实现未知尺寸的图片(但高宽都小于200px)在200px的正方形容器中水平和垂直居中。”当然出题并不是随意，而是有其现实的原因，垂直居中是 淘宝 工作中最 在曾经的 淘宝UED 招聘 中有这样一道题目： “使用纯CSS实现未知尺寸…

    程序猿的头像 程序猿
    用户投稿 2025年12月23日
    000

  • CSS派生选择器

    [导读] 派生选择器通过依据元素在其位置的上下文关系来定义样式，你可以使标记更加简洁。在 css1 中，通过这种方式来应用规则的选择器被称为上下文选择器 (contextual selectors)，这是由于它们依赖于上下文关系来应 派生选择器 通过依据元素在其位置的上下文关系来定义样式，你可以使标…

    程序猿的头像 程序猿
    用户投稿 2025年12月23日
    000
  • CSS 基础语法 用户投稿

    CSS 基础语法

    [导读] css 语法 css 规则由两个主要的部分构成：选择器，以及一条或多条声明。selector {declaration1; declaration2;     declarationn }选择器通常是您需要改变样式的 html 元素。每条声明由一个属性和一个 CSS 语法 CSS 规则由两…

    程序猿的头像 程序猿
    2025年12月23日
    400

  • CSS 高级语法

    [导读] 选择器的分组你可以对选择器进行分组，这样，被分组的选择器就可以分享相同的声明。用逗号将需要分组的选择器分开。在下面的例子中，我们对所有的标题元素进行了分组。所有的标题元素都是绿色的。h1,h2,h3,h4,h5 选择器的分组 你可以对选择器进行分组，这样，被分组的选择器就可以分享相同的声明…

    程序猿的头像 程序猿
    用户投稿 2025年12月23日
    000

  • CSS id 选择器

    [导读] id 选择器id 选择器可以为标有特定 id 的 html 元素指定特定的样式。id 选择器以 ” ” 来定义。下面的两个 id 选择器，第一个可以定义元素的颜色为红色，第二个定义元素的颜色为绿色： red {color:re id 选择器 id 选择器可以为标有特…

    程序猿的头像 程序猿
    用户投稿 2025年12月23日
    000

  • 有关css的绝对定位

    [导读] 定位（左边和顶部） css定位属性将是网虫们打开幸福之门的钥匙： h4 { position: absolute; left: 100px; top: 43px }这项css规则让浏览器将 的起始位置精 确地定在距离浏览器左边100象素，距离其 定位（左边和顶部） css定位属性将是网虫们…

    程序猿的头像 程序猿
    用户投稿 2025年12月23日
    000
  • html5怎么加php_html5用Ajax与PHP后端交互实现数据传递【交互】 用户投稿

    html5怎么加php_html5用Ajax与PHP后端交互实现数据传递【交互】

    HTML5不能直接运行PHP，需通过Ajax与PHP通信：前端用fetch发送请求，PHP接收处理并返回JSON，前端解析响应更新DOM；注意跨域、编码、CSRF防护和输入过滤。 HTML5 本身是前端标记语言，不能直接运行 PHP 代码，但可以通过 Ajax（异步 JavaScript）与 PHP…

    程序猿的头像 程序猿
    2025年12月23日
    700
  • 手机端怎么运行html文件_手机端运行html文件方法【教程】 用户投稿

    手机端怎么运行html文件_手机端运行html文件方法【教程】

    可通过手机浏览器、代码编辑器、本地服务器或在线工具四种方式预览HTML文件：一、用文件管理器打开HTML并选择浏览器即可渲染页面；二、使用Acode等编辑器导入文件后点击预览功能实时查看；三、对复杂项目可用KSWEB搭建本地服务器，将文件放入指定目录后通过http://127.0.0.1:8080访…

    程序猿的头像 程序猿
    2025年12月23日
    000
  • html5如何插入txt纯文本_html5txt文本嵌入与编码设置【实操】 用户投稿

    html5如何插入txt纯文本_html5txt文本嵌入与编码设置【实操】

    可通过iframe、fetch+pre、object标签或服务端预处理四种方式在HTML5中显示外部TXT文件，需重点处理字符编码（如UTF-8声明、BOM、响应头）并防范XSS风险。 如果您希望在HTML5页面中显示外部TXT纯文本文件的内容，浏览器默认不支持直接嵌入TXT文件为可渲染内容，必须通…

    程序猿的头像 程序猿
    2025年12月23日
    000
  • php如何html_在PHP代码中输出HTML内容【输出】 用户投稿

    php如何html_在PHP代码中输出HTML内容【输出】

    必须确保PHP正确解析并输出原始HTML字符串而非转义文本；可通过echo/print直接输出、heredoc语法处理多行含变量HTML，或用PHP结束标签切换至纯HTML模式。 如果您在PHP脚本中需要将HTML代码作为响应内容发送给浏览器，则必须确保PHP正确解析并输出原始HTML字符串，而非将…

    程序猿的头像 程序猿
    2025年12月23日
    000
  • html5标题如何缩短_HTML5标题缩短方法与显示优化技巧【详解】 用户投稿

    html5标题如何缩短_HTML5标题缩短方法与显示优化技巧【详解】

    HTML5标题优化有五种方法：一、CSS text-overflow截断；二、JavaScript动态裁剪；三、服务端预截断；四、CSS clamp响应式缩放；五、HTML语义化标记配合aria属性。 如果您在网页开发中发现HTML5标题过长，导致在移动端或窄屏设备上显示不全、换行错乱或影响页面美观…

    程序猿的头像 程序猿
    2025年12月23日
    000

发表回复

登录后才能评论
关注微信