javascript（jQuery）实现一个简单的5秒倒计时，并跳转网页

时间：12-09来源：作者：点击数：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>倒计时五秒</title>
		<script>
			//使用匿名函数方法
			function countDown(){
				
				var time = document.getElementById("Time");
				//alert(time.innerHTML);
				//获取到id为time标签中的内容，现进行判断
				if(time.innerHTML == 0){
					//等于0时清除计时
					window.location.href="https://www.baidu.com";
				}else{
					time.innerHTML = time.innerHTML-1;
				}
			}
			//1000毫秒调用一次
			setInterval(countDown,1000);
		</script>
		<style>
			#Time,#p{
				font-size: 100px;
				text-align: center;
			}
		</style>
	</head>
	<body>
		<p id="Time">5</p>
	</body>
</html>

用jQuery：

<!DOCTYPE html>
<html>
	<head>
        <meta charset="UTF-8">
        <title>倒计时五秒</title>
        <script src="js/jquery-1.12.4.min.js"></script>
        <script>
        //使用匿名函数方法
            function counttime() {
                var $time = $('#Time');
                if($time.html() === '1'){
                    window.location.href=("http://www.baidu.com");
                }else{
                    $time.html($time.html()-1);
                }
            }
            setInterval(counttime,1000);
        </script>
        <style>
            #Time,#p{
            font-size: 100px;
            text-align: center;
            }
        </style>
    </head>
    <body>
        <p id="Time">5</p>
    </body>
</html>

方便获取更多学习、工作、生活信息请关注本站微信公众号 城东书院微信服务号

来顶一下

返回首页

上一篇:用JS解析LRC格式的歌词，实现歌词同步滚动效果下一篇:js获取Audio音乐的总时长

如何快速了解一个行业	InDesign入门教程\|半
Vmware虚拟机三种网络	Git的安装与卸载详细