如何判断网页元素是否到达可视区域？
【概念释义】
判断元素进入可视区域可用 getBoundingClientRect 与视口宽高比较，或 IntersectionObserver（推荐，性能好、可异步）。
【基础使用】
javascript
function isInViewport(el) {
const r = el.getBoundingClientRect();
return (
r.top < window.innerHeight &&
r.bottom > 0 &&
r.left < window.innerWidth &&
r.right > 0
);
}登录查看完整 776 字
回答讨论
暂无讨论，登录后可抢先发言
本题库更多题目（50）
- JavaScript中for...in和for...of 有哪些关键差异？
- JavaScript 的 forEach和 map 方法 有哪些关键差异？
- 常见 avaScript 脚本延迟加载的方式 有哪些？分别说明？
- JavaScript中 substring和 substr函数 有哪些关键差异？
- 请解释：JavaScript 中的包装类型 是什么？
- JavaScript中如何进行隐式类型转换？
- 请解释：DOM和BOM 是什么？
- Object.is0与比较操作符==和=== 有哪些关键差异？
- JavaScript中|和&&操作符的返回值是什么？
- isNaN和Number.isNaN函数 有哪些关键差异？
- 如何判断网页元素是否到达可视区域？
- JavaScript中+操作符什么时候用于字符串的拼接？
- JavaScript其他值到数字值的转换规则是什么？
- JavaScript 的 splice 和 slice 函数会改变原数组吗？
- 请解释：AJAX?如何实现一个AJAX请求 是什么？
- 常见 JavaScript中常用的正则表达式 有哪些？分别说明？
- JavaScript中如何合并对象？
- typeof NaN的结果是什么？
- 如何判断JavaScript变量是数组？
- JavaScript 中为什么会有Biglnt 的提案？
- JavaScript中怎么删除数组最后一个元素？
- escape、encodeURl、encodeURIComponent 有哪些关键差异？
- ajax、axios、fetch 有哪些关键差异？
- 常见 常见的DOM操作 有哪些？分别说明？
- 常见 JavaScript中判断数据类型的方式 有哪些？分别说明？
- typeof 和instanceof 有哪些关键差异？
- typeof null的结果是什么?为什么？
- 常见 JavaScript 有哪些？分别说明内置对象？
- JavaScript中 null 和 undefined 有哪些关键差异？
- 常见 JavaScript 的数组 有哪些？分别说明原生方法？
- JavaScript 如何使用for...of 遍历对象？
- JavaScript有哪些数据类型?它们 有哪些关键差异？
- 为何JavaScript中0.1+0.2!==0.3，如何让其相等？请说明原因与场景？
- JavaScript其他值到布尔值的转换规则是什么？
- 请解释：JavaScript的类数组对象?如何转化为数组 是什么？
- JavaScript如何判断一个对象是否属于某个类？
- 常见 avaScript数组的遍历方法 有哪些？分别说明？
- JavaScript脚本异步加载如何实现?各 有哪些关键差异？
- JavaScript其他值到字符串的转换规则是什么？
- JavaScript 的==和=== 有哪些关键差异？
- Object.assign 与 对象扩展运算符 有何不同？?是深拷贝还是浅拷贝？
- JavaScript数组的 map和forEach 函数中能否通过break 等语法结束循环？
- use strict是什么意思?使用它 有哪些关键差异？
- JavaScript中 Map和Object 有哪些关键差异？
- 为何JavaScript 函数的arguments参数是类数组而不是数组?如何遍历类数组？请说明原因与场景？
- mouseover 和 mouseenter事件 有哪些关键差异？
- const 对象的属性可以修改吗？
- 如何获取安全的undefined值？
- JSON 的核心概念是什么？请结合实践说明？
- ==操作符的强制类型转换规则是什么？