JavaScript中判断元素是否在可视区域内
1.有什么应用
- 懒加载
- 列表的无限滚动
- 计算广告元素的曝光情况
2.方法1-----使用offsetTop、scrollTop
offsetTop、scrollTop属于三大家族的内容,详情见https://blog.csdn.net/fageaaa/article/details/145728760。
思路:元素的offsetTop-页面的scrollTop<=页面的高度
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Title</title>
<style>
.area1,
.area3 {
width: 100%;
height: 1200px;
background-color: aqua;
}
.box {
width: 100%;
height: 100px;
background-color: red;
}
</style>
</head>
<body>
<div class="area1"></div>
<div class="area2 box"><