setTimeout和setInterval
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了setTimeout和setInterval相关的知识，希望对你有一定的参考价值。
setTimeout和setInterval
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>setInterval和setTimeout</title>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<style>
*{margin: 0;padding: 0;}
.one{width: 100px;height: 100px;overflow: hidden;}
.aa{width: 100px;height: 100px;}
.aa:nth-child(1){background: red;}/* :nth-child(n) 匹配其父元素的第n个子元素,不论类型*/
.aa:nth-child(2){background: green;}
.aa:nth-child(3){background: purple;}
.img{width: 100px;height: 100px;}
.img img{width: 100px;height: 100px;background-size: 100px 100px;}
</style>
</head>
<body>
<div class="one">
<div class="aa"></div>
<div class="aa"></div>
<div class="aa"></div>
</div>
<div class="img"></div>
<script>
var x=0;
function Odisplay()
{
$(‘.one .aa‘).hide();
$(‘.one .aa‘).eq(x).show();
x=x+1;
if(x==$(‘.one .aa‘).length){x=0;}
}
setInterval(‘Odisplay()‘,1000);
var j = 1;
function changeUrl()
{
//var imgurl = $(‘.img‘).html(‘<img src="img/timo0‘+j+‘.jpg">‘);
var imgurl = $(‘.img‘).css(‘background‘,‘url(img/timo0‘+j+‘.jpg) no-repeat‘);
j++;
if(j==4){j=1;}
setTimeout(‘changeUrl()‘,1000);
}
changeUrl();
//setInterval(‘changeUrl()‘,1000);
</script>
</body>
</html>
以上是关于setTimeout和setInterval的主要内容，如果未能解决你的问题，请参考以下文章