js 文章列表li 分页
来源:互联网 发布:千牛mac登不上去 编辑:程序博客网 时间:2024/05/19 11:45
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>li文章分页</title></head><body><ul id="all"> <li>第1集</li> <li>第2集</li> <li>第3集</li> <li>第4集</li> <li>第5集</li> <li>第6集</li> <li>第7集</li> <li>第8集</li> <li>第9集</li> <li>第10集</li> </ul><div class="page">第<span id="a2"></span>/<span id="a1"></span>页<span id="a3"></span> <a href="#" onClick="change(--pageno)">上一页</a><a href="#" onClick="change(++pageno)">下一页</a></div><script>var a = document.getElementById("all").getElementsByTagName("li");var zz =new Array(a.length);for(var i=0;i <a.length;i++){ zz[i]=a[i].innerHTML; } //div的字符串数组付给zzvar pageno=1 ; //当前页var pagesize=5; //每页多少条信息if(zz.length%pagesize==0){var pageall =zz.length/pagesize ;}else{var pageall =parseInt(zz.length/pagesize)+1; } //一共多少页 function change(e){pageno=e;if(e<1){ //如果输入页<1页e=1;pageno=1;//就等于第1页 , 当前页为1} if(e>pageall){ //如果输入页大于最大页e=pageall;pageno=pageall; //输入页和当前页都=最大页}document.getElementById("all").innerHTML=""//全部清空for(var i=0;i<pagesize;i++){var div =document.createElement("li")//建立div对象div.innerHTML=zz[(e-1)*pagesize+i]//建立显示元素document.getElementById("all").appendChild(div)//加入all中 if(zz[(e-1)*pagesize+i+1]==null) break;//超出范围跳出 }var ye="";for(var j=1;j<=pageall;j++){ if(e==j){ye=ye+"<span><a href='#' onClick='change("+j+")' style='color:#FF0000'>"+j+"</a></span> "}else{ye=ye+"<a href='#' onClick='change("+j+")'>"+j+"</a> "}}document.getElementById("a1").innerHTML=pageall;document.getElementById("a2").innerHTML=pageno;document.getElementById("a3").innerHTML=ye;}change(1);</script></body></html>
0 0
- js 文章列表li 分页
- 去除织梦DedeCMS列表和文章分页标签源码中的<li>
- 去除织梦DedeCMS列表和文章分页标签源码中的<li>
- js 点击列表li,获得当前li的id
- JS组装 HTML片段 列表 ul li
- js为li列表添加点击事件
- JS详细文章分页
- js 分页 显示文章
- js文章分页
- 文章列表分页+二级导航
- js 列表,分页
- js 分页列表组件
- 阮一峰js文章列表
- php---mysql+ajax 无序列表(ul li)分页实现
- li里的文章列表左右分浮动
- li里的文章列表左右分浮动
- js实现长文章分页
- js的大文章分页
- poj1691 Painting A Board(DFS+拓扑)
- 查找附近网点geohash算法及实现 (Java版本)
- Linux命令行下的文本编辑器
- 获得已安装软件的签名信息
- OC语言之内存管理
- js 文章列表li 分页
- linux mmap函数详解
- Attempted to lock an already-locked dir异常解决方法
- iOS 中的 va_list\va_arg\va_start和va_end的使用
- APK安装过程及原理详解
- java学习笔记8 - maven profile实现多环境打包
- iOS 汉子转拼音 按首字母排序
- Android学习笔记——OAuth完全手册_国内篇
- 三年的程序员菜鸟