20.js获取页面卷去的距离以及滚到到指定位置
监听window.onscroll事件
获取上面卷去的距离：document.documentElement.scrollTop
获取左边卷去的距离：document.documentElement.scrollLeft
滚动到指定位置
执行 window.scrollTo(参数) 事件
语法1—传递数字:
window.scrollTop(x，y）
x—表示横向滚动的距离
y—表示纵向滚动的距离
语法2—传递对象：
widow.scrollTop({left:xxx,top:xxx})
或者可以添加behavior属性，属性值为smooth，表示平滑滚动
比如：window.scrollTo({left:10, top: 10, behavior: "smooth" })
例子：
<!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><style>div {height: 1300px;width: 2000px;background-color: pink;}</style></head><body><button id="btn">点击</button><div></div><script>/* 浏览器卷去的尺寸卷去的高度document.documentElement.scrollTop卷去的宽度document.documentElement.scrollLeft*/// 页面一打开就执行了，滚动条没动就为0console.log(document.documentElement.scrollTop); //0//要用onscroll动态获取//浏览器上面卷去的尺寸window.onscroll = function () {console.log(document.documentElement.scrollTop);// 浏览器左边卷去的尺寸// console.log(document.documentElement.scrollLeft);};//传递数字// btn.onclick = function () {// window.scrollTo(10, 500);// };//传递对象btn.onclick = function () {window.scrollTo({ top: 1000, behavior: "smooth" });};</script></body> </html>