123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Document</title>
- </head>
- <body>
- <div>
- <button id="btn1">去底部</button>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <div>hahahhhhhhhhhhhhhhhhhhhhhhh</div>
- <button id="btn">回顶部</button>
- <button id="btn3"> 随机数</button>
- </div>
- <script>
- var btn = document.getElementById('btn')
- var btn1 = document.getElementById('btn1')
- var btn3 = document.getElementById('btn3')
- btn.onclick = function () {
- // console.log(scrollTop)
- // scrollTo(0,30) 相对于 右侧坐标
- // scrollBy(0,-30) // 相对于当前本身坐标
- var a = setInterval(function () {
- //滚动条滚动的距离
- var scrollTop = document.documentElement.scrollTop || document.body.scrollTop
- if (scrollTop > 0) {
- scrollBy(0, -30)
- console.log(scrollTop)
- } else {
- clearInterval(a)
- console.log('我挂掉了')
- }
- }, 100)
- }
- btn1.onclick = function(){
- var b = setInterval(function(){
- var scrollTop = document.documentElement.scrollTop || document.body.scrollTop
- if(scrollTop < 542.4000244140625){
- scrollBy(0,30)
- console.log(scrollTop)
- } else{
- clearInterval(b)
- console.log('我挂掉了')
- }
- },100)
- }
- btn3.onclick = function(){
- console.log(Math.random())//生成0-1之间的随机小数
- // var a = setTimeout(function(){
- // console.log(Math.random())
- // },5000)
- //setTimeout 只执行一次
- //setInterval 一直执行 除非清除 clearInterval
- //Math.random()
- //Math.floor() 向下取整 和四舍五入没关系
- var a = setInterval(function(){
- console.log(Math.floor(Math.random()*100))
-
- },1000)
- }
- </script>
- </body>
- </html>
|