& lt; ! DOCTYPE html>
<meta HTTP - equiv="content-type" content="text/HTML. Charset=utf-8 "& gt;Web page special effects of static code page effect & lt;/title> <br/><style type="text/CSS" & gt; <br/>Li {display: none} <br/></style> <br/></head> <br/><body> <br/><Ul id="box" & gt; <br/><Li> Static web page paging effect 01 & lt;/li> <br/><Li> Static web page paging effect 02 & lt;/li> <br/><Li> Effect of static web pages on page 3 & lt;/li> <br/><Li> Effect of static web pages on page 4 & lt;/li> <br/><Li> Effect of static web pages on page 5 & lt;/li> <br/><Li> Effect of static web pages on page 6 & lt;/li> <br/><Li> The effect of static web pages 07 page & lt;/li> <br/><Li> Static web page paging effect 08 & lt;/li> <br/><Li> Effect of static web pages on page 9 & lt;/li> <br/><Li> Effect of static web pages 10 pages & lt;/li> <br/><Li> Effect of static web page 11 pages & lt;/li> <br/><Li> Effect of static web pages 12 pages & lt;/li> <br/><Li> Effect of static web pages on page 13 & lt;/li> <br/><Li> Effect of static web pages on page 14 & lt;/li> <br/><Li> Effect of static web page 15 pages & lt;/li> <br/><Li> Effect of static web page 16 pages & lt;/li> <br/><Li> Effect of static web pages on page 17 & lt;/li> <br/><Li> Effect of static web pages 18 pages & lt;/li> <br/><Li> Effect of static web pages on page 19 & lt;/li> <br/><Li> Effect of static web page 20 pages & lt;/li> <br/></ul> <br/><Div id="page" & gt; </div> <br/><script language="javascript" & gt; <br/>Var obj, j; <br/>Var page=0; <br/>Var currentPage=0;//the current page <br/>Var listNum=2;//each page shows & lt; Ul> Count <br/>Var PagesLen;//total number of pages <br/>Var PageNum=4;//paging links to connect number (5) <br/>Window. The onl oad=function () {<br/>Obj=document. GetElementById (" box "). The getElementsByTagName (" li "); <br/>J=obj length//the number of li <br/>PagesLen=math.h ceil (j/listNum);//total number of pages <br/>UpPage (0) <br/>} <br/>The function upPage (p) {<br/>CurrentPage=p <br/>//content change <br/>For (var I=0; I & lt; j; I++) {<br/>Obj [I]. Style. The display="none" <br/>} <br/>For (var I=p * listNum; I & lt; (p + 1) * listNum; I++) {<br/>If (obj) [I] obj [I] style. The display="block"; <br/>console.log(i); <br/>} <br/>//paging links to transform <br/>Var strS='& lt; A href="https://bbs.csdn.net/topics/#!" "Onclick=" upPage (0) & gt; The homepage & lt;/a> ';//page <br/>Var PageNum_2 PageNum=% 2==0? Math. Ceil (PageNum/2) + 1: math.h ceil (PageNum/2); <br/>Var PageNum_3 PageNum=% 2==0? Math. Ceil (PageNum/2) : math.h ceil (PageNum/2) + 1; <br/>The console. The log (PageNum_2 PageNum_3); <br/>Var strC=", "startPage, endPage; <br/>If (PageNum & gt;={PagesLen) <br/>StartPage=0; <br/>EndPage=PagesLen - 1; <br/>} else if (currentPage & lt; PageNum_2) {<br/>StartPage=0; <br/>EndPage=PagesLen - 1 & gt; PageNum? PageNum: PagesLen - 1; <br/>} else {<br/>StartPage=(currentPage + PageNum_3 & gt;=PagesLen)? PagesLen PageNum - 1: currentPage PageNum_2 + 1; <br/>Var t=startPage PageNum +; <br/>EndPage=(t & gt; PagesLen)? PagesLen - 1: t; <br/>} <br/>The console. The log (startPage, endPage); <br/>For (var I=startPage; I & lt;=endPage; I++) {<br/>If (I==currentPage) strC +='& lt; A href="https://bbs.csdn.net/topics/###" style="color: red; The font - weight: 700;" The onclick="upPage (' + I + ')" & gt; '+ (I + 1) +' & lt;/a> '<br/>The else strC +='& lt; A href="https://bbs.csdn.net/topics/#! '+ (I + 1) +' "onclick=" upPage (' + I + ') "& gt; '+ (I + 1) +' & lt;/a> '<br/>Document. The getElementsByTagName (" title ") [0]. The innerText="+ (I + 1) +"; <br/><br/>} <br/>Var strE='& lt; A href="https://bbs.csdn.net/topics/#!" The onclick="upPage (' + (PagesLen - 1) + ')" & gt; Back & lt;/a> ';//back <br/>Var strE2=currentPage + 1 + "/" + PagesLen + "page" + ", "+ j +" article "; Article//* <br/>Document. The getElementById (" page "). The innerHTML=strS + strC + + strE2 strE; <br/>} <br/></script> <br/></body> <br/></html> </pre> <br/><br/>Add to achieving document. GetElementsByTagName (" title ") [0]. The innerText='the current page is xx; <br/><br/><img SRC="https://img.codepudding.com/202010/123901010653151.png" Alt=""/> <br/><br/><br/>Click on the page to modify the current title is page 1<p class="article - content rp"> CodePudding user response: </p>To solve itself. Thanks<p class="article - content rp"> CodePudding user response: </p>Document. The title="the current page is xx" <br/> </div> <div class="th_page th_page_color"></div> <div class="umCopyright"> <p>Page link：<a href="/frontend/44368.html" target="_blank" style="color:#999">https//www.codepudding.com/frontend/44368.html</a></p> </div> <div class="detail-arr"> <div class="detail-arr-left">Prev:<a href='/frontend/44367.html'>Use the vue - recourse post request local json files an error 404 no found</a></div> <div class="detail-arr-right">Next:<a href='/frontend/44369.html'>WeChat small programs cover the drop-down box</a></div> </div> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="hot-tags neitags"> <ul> <li><i class="iconfont icon-x-tags"></i> Tags： </li> <a href='/e/tags/?tagname=JavaScript' target='_blank'>JavaScript</a> </ul> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="xiangguan"> <ul class="msg msghead"> <li class="tbname">Related</li> </ul> <ul> </ul> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="flinks"> <ul> <li><i class="iconfont icon-x-tags"></i> Links： </li> <li class="liflinks"><a target="_blank" href="/" title="CodePudding">CodePudding</a></li> </ul> </div> </div> </div> </div> <div class="footer"> <p><span style="font-size:16px;color:#666;font-weight: bold">About Us:</span> <a href="https://www.codepudding.com/contact.html">Contact Us</a> <a href="https://www.codepudding.com/service.html">Terms of Service</a> <a href="https://www.codepudding.com/privacy.html"> Privacy Policy</a></p> <p class="foot_info">Copyright © 2010-2023，Powered By <a href="/" target="_blank">CodePudding</a> </p> </div> <script type="text/javascript" src="/skin/code/tianhu.js"></script> </body></html>
