摘要：
知识点1.窗口。scrollTo（x，y）：您可以将内容滚动到指定位置scrollscroll：滚动意味着（滚动）从上到下移动1.window。onscroll窗口滚动事件（只有在有滚动条时才能触发）body｛height:5000px；｝窗onscroll=function（）｛console.log（0）｝2.scrollWidth获取框的高度scrollWidth=框宽度+内边缘
知识点
1、window.scrollTo （x,y）:可以把内容滚动到指定位置
scroll
scroll：卷动意思（书卷） 从上到下移动
1、window.onscroll 窗口滚动事件（必须有滚动条才可以触发）
body{height: 5000px;} window.onscroll=function () { console.log(0) }
2、scrollWidth 获取盒子的高
scrollWidth =盒子宽+内边距（不包括外边距 ， 边框）
var div=document.getElementsByTagName("div")[0]; console.log(div.scrollWidth);
3、scrollHeight 高度 （很少用）
scrollHeight =盒子高+内边距（不包括外边距 ， 边框）
如果内容没有溢出盒子，高度就是盒子本身+内边距
如果溢出，高度就是超出内容的总高度
ie7（包括ie7）高度就是内容的高度
4、scrollTop 窗口滚动的时候，页面被浏览器遮挡的高度 (调用者文档页面)
scrollLeft 窗口滚动的时候，页面被浏览器遮挡的宽度
<script> window.onscroll=function () { // console.log(document.body.scrollTo) document.title=document.body.scrollTop; document.title=document.body.scrollLeft; } </script>
5、scroll 兼容性
DTD，只有旧版本的浏览器遵循一些新的规则 （html4 有dtd）
<script > window.onscroll=function() { //没有约束的 dtd 兼容 谷歌只认（document.body 有没有dtd都可以） IE9+ document.title=document.body.scrollTop; （认为body在动） //有约束的 dtd 兼容 IE6、7、8 只认（document.documentElement有没有dtd都可以） IE9+任何时候 document.title = document.documentElement.scrollTop;(文档在动) //不管有没有 dtd 兼容 火狐 、 谷歌 、IE9+以上的 不兼容IE678 document.title=window.pageYOffset (窗口的纵坐标在动) } </script>
兼容性写法
document.title=document.documentElement.scrollTop || document.body.scrollTop
最常用的兼容写法
//最常用的兼容写法 document.title= window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
(1)CSS1Compat 已经声明
(2)BackCmpat 为声明
<script>
alert(document.compatMode)
</script>7、自己分装一个，scroll兼容性写法
<script> window.onscroll=function () { document.title=scroll().top+"^^^^"+scroll().left }; //需求封装一个兼容 scroll的 //分装当然用函数了 function scroll(){ //如果这个window.pageYOffset 存在那么返回值是0-无穷大 //如果没有这个值，返回值是undefined //只要判断不是undefined就可以调用次方法 if(window.pageYOffset !== undefined){ var josn={ "top":window.pageYOffset, "left":window.pageXOffset }; return josn }else if(document.compatMode==="CSS1Compat"){ //返回一个json数组 return { "top": document.documentElement.scrollTop, "left": document.documentElement.scrollLeft } }else { return { "top": document.body.scrollTop, "left": document.body.scrollLeft } } } </script>