cnblogs/dcrenl/js分页.html

<div id="sina_keyword_ad_area2" class="articalContent   ">
<div><br />
</div>
<div>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;</div>
<div>&lt;html xmlns="http://www.w3.org/1999/xhtml"lang="utf-8"&gt;</div>
<div>&lt;head&gt;</div>
<div>&lt;meta http-equiv="Content-Type"content="text/html; charset=gb2312" /&gt;</div>
<div>&lt;meta name="Keywords" content="upsscs,网站设计,网站制作" /&gt;</div>
<div>&lt;meta name="Description" content="upsscs,网站设计,网站制作" /&gt;</div>
<div>&nbsp; &nbsp;&nbsp;&lt;title&gt;辛苦分页程序--三原色阿PAUL&lt;/title&gt;</div>
<div>&lt;style type="text/css"&gt;</div>
<div>&lt;!--</div>
<div>body{margin:0px; padding:0px}</div>
<div>#mainbody{margin:12px auto ; width:600px; border:1px solid#f2f2f2; background-color:#FF9900}</div>
<div>#showmess{margin:12px auto ; width:600px; border:1px solid#f2f2f2;}</div>
<div>#pages{margin:12px auto ; width:600px; border:1px solid#f2f2f2;}</div>
<div>ul{ margin:0px; padding:0px; }</div>
<div>ul li{margin:3px 0px; padding-left:15px; font-size:14px;line-height:20px; background-color:#CEEAFF}</div>
<div>dl{ margin:0px; padding:0px; height:280px }</div>
<div>dl dd{margin:3px 0px; padding-left:15px; font-size:14px;line-height:20px; background-color:#CEEAFF}</div>
<div>A:link,A:visited,A:active{display:block; float:left;margin:2px 5px; width:50px; height:auto; line-height:21px;color:#000033; font-size:12px; text-decoration:none}</div>
<div>A:hover{color:#FF6600; text-decoration:none}</div>
<div>--&gt;</div>
<div>&lt;/style&gt;</div>
<div>&lt;/head&gt;</div>
<div>&lt;body&gt;</div>
<div>&lt;div id="showmess"&gt;</div>
<div>&lt;dl id="showme"&gt;</div>
<div>&lt;/dl&gt;</div>
<div>&lt;/div&gt;</div>
<div>&lt;div id="mainbody" style="display:none"&gt;</div>
<div>&lt;ul&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;li&gt;10&lt;/li&gt;</div>
<div>&lt;li&gt;11&lt;/li&gt;</div>
<div>&lt;li&gt;12&lt;/li&gt;</div>
<div>&lt;li&gt;13&lt;/li&gt;</div>
<div>&lt;li&gt;14&lt;/li&gt;</div>
<div>&lt;li&gt;15&lt;/li&gt;</div>
<div>&lt;li&gt;16&lt;/li&gt;</div>
<div>&lt;li&gt;17&lt;/li&gt;</div>
<div>&lt;li&gt;18&lt;/li&gt;</div>
<div>&lt;li&gt;19&lt;/li&gt;</div>
<div>&lt;li&gt;20&lt;/li&gt;</div>
<div>&lt;li&gt;21&lt;/li&gt;</div>
<div>&lt;li&gt;22&lt;/li&gt;</div>
<div>&lt;li&gt;23&lt;/li&gt;</div>
<div>&lt;li&gt;24&lt;/li&gt;</div>
<div>&lt;li&gt;25&lt;/li&gt;</div>
<div>&lt;li&gt;26&lt;/li&gt;</div>
<div>&lt;li&gt;1sss&lt;/li&gt;</div>
<div>&lt;li&gt;2sss&lt;/li&gt;</div>
<div>&lt;li&gt;3ss&lt;/li&gt;</div>
<div>&lt;li&gt;4sss&lt;/li&gt;</div>
<div>&lt;li&gt;5ssss&lt;/li&gt;</div>
<div>&lt;li&gt;6sssss&lt;/li&gt;</div>
<div>&lt;li&gt;7&lt;/li&gt;</div>
<div>&lt;li&gt;8ssss&lt;/li&gt;</div>
<div>&lt;li&gt;9sewdewd&lt;/li&gt;</div>
<div>&lt;/ul&gt;</div>
<div>&lt;/div&gt;</div>
<div>&lt;divid="pages"&gt;&lt;/div&gt;</div>
<div>&lt;scriptlanguage="javascript"&gt;</div>
<div>var toutaltiao;</div>
<div>var toutalpage;</div>
<div>var onpage;</div>
<div>var tiaoshu=12;</div>
<div>var firstiao;</div>
<div>function g(v){return document.getElementByIdx_x(v);}</div>
<div>var mylii=document.getElementsByTagName_r("li")</div>
<div>toutaltiao=mylii.length;</div>
<div>if (toutaltiao==0){</div>
<div>toutalpage=parseInt(toutaltiao/12)</div>
<div>}else{</div>
<div>toutalpage=parseInt(toutaltiao/12)+1</div>
<div>}</div>
<div>function setpage(page){</div>
<div>g("showme").innerHTML="";</div>
<div>onpage=page;</div>
<div>firstiao=(onpage-1)*tiaoshu;</div>
<div>&nbsp; &nbsp;for (var i=firstiao;i&lt;firstiao+12; i++)</div>
<div>&nbsp; &nbsp;{</div>
<div>&nbsp;&nbsp;g("showme").innerHTML=g("showme").innerHTML+"&lt;dd&gt;"+mylii[i].innerHTML+"&lt;/dd&gt;";</div>
<div>&nbsp; &nbsp;&nbsp;}</div>
<div>&nbsp; &nbsp; &nbsp;returnfalse;</div>
<div>}</div>
<div>function writepage(){</div>
<div>for (var i=1; i&lt;toutalpage+1; i++)</div>
<div>g("pages").innerHTML=g("pages").innerHTML+"&lt;ahref='###' onclick='setpage("+i+")'&gt;第 "+ i +"页&lt;/a&gt;";</div>
<div>}</div>
<div>window.onload=function(){</div>
<div>setpage(1);</div>
<div>}</div>
<div>&lt;/script&gt;</div>
<div>&lt;scriptlanguage="javascript"&gt;writepage();&lt;/script&gt;</div>
<div>&lt;/body&gt;</div>
<div>&lt;/html&gt;</div>

</div>
<p>&nbsp;</p>