<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.div1{
width: 600px;
height: 400px;
background: palevioletred;
margin: 0 auto;
transition: all 0.5s;
}
</style>
</head>
<body>
<div class="div1">
</div>
<script type="text/javascript">
var div1 = document.querySelector('.div1')
var fn = function(){
//0-255
console.log('要变化颜色')
var red = parseInt(256*Math.random()) //parseInt()向下取整，256*[0，1)的数那么就等于0-256的随机浮点数，不含256
var green = parseInt(256*Math.random())
var blue = parseInt(256*Math.random())
div1.style.background = `rgb(${red},${green},${blue})`;
// div1.style.background = 'rgb('+red+','+green+','+blue+')'
}
var intervalId = setInterval(fn,100)
clearInterval(intervalId)
console.log('setInterval后面的内容')
window.Math.random() //[0-1)
var timeoutNum = setTimeout(fn,2000)
var abc = setTimeout(fn,4000)
console.log(timeoutNum)
console.log(abc)
// clearTimeout(abc)
// clearTimeout(timeoutNum)
//
div1.addEventListener('touchstart',function(){
console.log('swipeLeft')
})
</script>
</body>
</html>
