Home Explore Help
Sign In
lovecoding
/
VIP28
9
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

new

zsydgithub 1 year ago
parent
09d39769f5
commit
59e5187527
2 changed files with 187 additions and 0 deletions
Unified View Show Diff Stats
  1. 132 0
      Bom/1_test.html
  2. 55 0
      Bom/2_定时器.html

+ 132 - 0
Bom/1_test.html
View File 

@@ -0,0 +1,132 @@
 
+<!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>
 
+  <button id="btn1">回到底部</button>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <div>hhhhhhhhhhhhhhhhhhhhhhh</div>
 
+  <button id="btn">回到顶部</button>
 
+
 
+  <script>
 
+    var btn = document.getElementById('btn')
 
+    var btn1 = document.getElementById('btn1')
 
+    //点击事件
 
+    /* scrollTo(x,y)——在窗体中如果有滚动条，将横向滚动条移动到相对于窗体宽度为x个像素的位置，将纵向滚动条移动到相对于窗体高度为y个像素的位置
 
+      scrollBy(x,y)—— 如果有滚动条，将横向滚动条移动到相对于当前横向滚动条的x个像素的位置(就是向左移动x像素)，将纵向滚动条移动到相对于当前纵向滚动条高度为y个像素的位置(就是向下移动y像素)
 
+    */
 
+    btn.onclick = function () {
 
+      console.log(btn)
 
+      // scrollTo(0,500)
 
+      // scrollBy(0,-500)
 
+      // scrollTo(0, 0)
 
+      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 () {
 
+      //925.5999755859375
 
+      var b = setInterval(function () {
 
+        var scrollTop = document.documentElement.scrollTop || document.body.scrollTop
 
+        console.log(scrollTop)
 
+        if (scrollTop < 925.5999755859375) {
 
+          scrollBy(0, 30)
 
+        } else {
 
+          clearInterval(b)
 
+          console.log('我挂掉了')
 
+        }
 
+      }, 100)
 
+    }
 
+  </script>
 
+</body>
 
+
 
+</html>

+ 55 - 0
Bom/2_定时器.html
View File 

@@ -0,0 +1,55 @@
 
+<!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>
 
+  <button id="btn">按钮</button>
 
+  <button id="stop">按钮B</button>
 
+  <button id="num">按钮C</button>
 
+  <script>
 
+    var btn = document.getElementById('btn')
 
+    var stop = document.getElementById('stop')
 
+    var num = document.getElementById('num')
 
+    /* 间隔多少毫秒去执行 */
 
+    btn.onclick = function () {
 
+      var b = 1
 
+      var a = setInterval(function () {
 
+        if (b < 10) {
 
+          b++
 
+          console.log(b)
 
+        } else {
 
+          clearInterval(a)
 
+        }
 
+      }, 1000)
 
+    }
 
+
 
+    stop.onclick = function () {
 
+      var c = setTimeout(function () {
 
+        console.log(111)
 
+      }, 1000)
 
+    }
 
+    /*  
+    setInterval   不断的去执行   通过clearInterval 清除定时器
 
+    setTimeout   只执行一次 */
 
+
 
+    num.onclick = function () {
 
+      //获取一个随机数
 
+      //Math.random()  0~1
 
+      //Math.floor  向下取整  跟四舍五入没关系   
+      var h = setInterval(function () {
 
+        var nn = Math.random() * 10
 
+        var mm = Math.floor(nn)
 
+        console.log(mm)
 
+      }, 1000)
 
+    }
 
+
 
+  </script>
 
+</body>
 
+
 
+</html>