以后地位:首页 > 建站常识 > 列表

JS文章列表Li分页案例

点击: 次时候:2018/11/27关头词:上海网站建造公司
HTML 代码上海网站建造公司<ul id="all"><li>上海网页设想公司</li><li>上海网站建造公司</li><li>上海网站建造须要几多钱</li><l
HTML 代码  上海网站建造公司
<ul id="all"><li>上海网页设想公司</li><li>上海网站建造公司</li><li>上海网站建造须要几多钱</li><li>上海网站设想哪家强</li><li>上海网站建造须要几多钱</li><li>上海网页设想几多钱</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>
JS 代码
<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的字符串数组付给zz	var pageno=1 ;              //以后页	var pagesize=9;            //每页几多条信息	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>
预定建站
收费供给网站优化
支付关头词