|
@@ -0,0 +1,66 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="en">
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <title>Document</title>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+ <button id="btn1">往下走</button>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <h2>哈哈哈哈哈哈</h2>
|
|
|
+ <button id="btn2">往上走</button>
|
|
|
+ <script>
|
|
|
+ /**
|
|
|
+ * JS:
|
|
|
+ * BOM:Browser Object Model (浏览器 对象 模型)
|
|
|
+ * DOM:Document Object Model (文档 对象 模型)
|
|
|
+ * ECMAScript:es(2015,2020,2021 =>5,6,7,8)
|
|
|
+ */
|
|
|
+ //获取元素标签
|
|
|
+ var btn1 = document.getElementById("btn1");
|
|
|
+ var btn2 = document.getElementById("btn2");
|
|
|
+ console.log(btn1,btn2,'按钮')
|
|
|
+ // 给元素添加点击事件
|
|
|
+ btn1.onclick = function() {
|
|
|
+ // scrollTo(x,y)距离窗口跳转
|
|
|
+ // scrollBy(x,y)距离自身跳转
|
|
|
+ // 每一秒钟执行一件事
|
|
|
+ // 定时器
|
|
|
+ var timer = setInterval(function(){
|
|
|
+ var scrollMain = document.documentElement.scrollTop || document.body.scrollTop;
|
|
|
+ console.log(scrollMain,'12')
|
|
|
+ console.log("执行")
|
|
|
+ if(scrollMain <= 706) {
|
|
|
+ scrollBy(0,200)
|
|
|
+ } else {
|
|
|
+ clearInterval(timer)
|
|
|
+ }
|
|
|
+ },1000)
|
|
|
+ }
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+</html>
|