|
@@ -0,0 +1,130 @@
|
|
|
+<!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>
|