需求：封装一个兼容的scroll(),返回值是json，用scroll().top获取scrollTop
需求：封装一个兼容的scroll(),返回值是json，用scroll().left获取scrollLeft
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
body{
height: 5000px;
5000px;
}
</style>
</head>
<body>
<script type="text/javascript">
//设置滚动事件
window.onscroll = function(){
//调用这个方法
console.log(scroll().top);
console.log(scroll().left);
}
//需求：封装一个兼容的scroll(),返回值是json，用scroll().top获取scrollTop
//需求：封装一个兼容的scroll(),返回值是json，用scroll().left获取scrollLeft
function scroll(){
//如果这个属性存在，那么返回值应该是0-无穷大
//如果没有返回值是undefined
//只要判断不是undefined就可以调用此方法
if (window.pageYOffset !==undefined) {
var json = {
"top":window.pageYOffset,
"left":window.pageXOffset
};
return json;
}else if (document.compatMode === "CSS1Compat") {//有DTD约束
return {
"top":document.documentElement.scrollTop,
"left":document.documentElement.scrollLeft
};
}else{//没有DTD约束
return {
"top":document.body.scrollTop,
"left":document.body.scrollLeft
};
}
//简单写法
// return {
// "top":document.body.scrollTop || document.documentElement.scrollTop || document.documentElement.scrollTop,
// "left":document.body.scrollLeft || document.documentElement.scrollLeft || window.pageXOffset
// };
}
</script>
</body>
</html>