【杂谈】js怎样完成倒计时跳转页面
2019-11-18杂谈搜奇网56°c
A+ A-
本篇文章重要给人人引见
js完成倒计时跳转页面结果的要领。
倒计时跳转页面的结果,想必人人在阅读各大网站时,都有遇见过,重要是为了运用网页页面越发人性化。
下面我们就经由过程细致的代码示例,为人人解说js完成倒计时跳转新页面的要领。
js完成倒计时跳转代码示例以下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>页面跳转</title> <style> *{ margin:0; padding:0; } a{text-decoration: none;color: #fff;font-size: 30px;text-shadow: 1px 2px 10px red;} p{ height:50px; width: 320px; margin:100px auto; } span{ display: inline-block; height: 50px; width:50px; line-height: 50px; font-size: 50px; color: #f00; text-align: center; } </style> </head> <body> <p>还剩<span>5</span>秒跳转至<a href="http://www.ki4.cn">ki4网</a></p> <script type="text/javascript"> var Espan=document.getElementsByTagName("span")[0] var i=4 function fuc() { if (i>0){ Espan.innerHTML=i i-- }else{ window.location.href="http://www.ki4.cn" } } setInterval("fuc()",1000) </script> </body> </html>
上述代码中的js部份,起首我们是经由过程getElementsByTagName要领猎取span标签对象,再定义一个变量i,这里的i就是时候。然后经由过程if语句先推断i是不是大于0,假如大于0就经由过程innerHTML要领插进去内容i,不然就跳转到页面“http://www.ki4.cn”,末了再运用setInterval()要领挪用fuc()函数。
那末前台终究完成的倒计时跳转结果以下图:
本篇文章就是关于js完成倒计时跳转页面的结果要领引见,具有肯定的参考价值,愿望对须要的朋侪有所协助!
以上就是js怎样完成倒计时跳转页面的细致内容,更多请关注ki4网别的相干文章!
标签:js倒计时跳转页面