当前位置:网站首页>Better performance and simpler lazy loading of intersectionobserverentry (observer)
Better performance and simpler lazy loading of intersectionobserverentry (observer)
2022-07-29 07:33:00 【Moon and stars】
( The following are personal understandings used in the project , If you have any mistakes, please correct them )
IntersectionObserverEntry It is used to observe the interaction degree of two nodes
One 、 Get the observed node
Triggered when the observed node enters the visual interface
var target = document.getElementById('xxx')
Two 、 Create observers
var loadingObserver = new IntersectionObserver(ObserverList=>{
// ObserverList Is an array of observed nodes , Of each of these elements isIntersecting Represents entry or exit
if(ObserverList[0].isIntersecting){
console.log(' Being loaded ...')
}
},{
// The degree to which the two goals overlap
threshold: 0.1,
// root by null Or when not writing, it defaults to the browser visual interface
root: null
})
3、 ... and 、 Add the observed target
// target Will be inserted above ObserverList in
loadingObserver.observe(target)
// Multiple can be added
loadingObserver.observe(target1)
loadingObserver.observe(target2)
边栏推荐
- JS break and continue and return keywords
- Using C language to skillfully realize the chess game -- Sanzi chess
- Use of gcc/g++
- 3-全局异常处理
- 我,28岁,测试员,10月无情被辞:想给还在学测试 的人提个醒......
- 计算程序运行时间 demo
- Android面试题 | 怎么写一个又好又快的日志库?
- [MySQL] - [subquery]
- 【WPF】通过动态/静态资源实现语言切换
- RoBERTa:A Robustly Optimized BERT Pretraining Approach
猜你喜欢

LANDSCAPE

零数科技深度参与信通院隐私计算金融场景标准制定

QT topic: basic components (button class, layout class, output class, input class, container class)

Sqlmap(SQL注入自动化工具)

log4qt内存泄露问题,heob内存检测工具的使用
Scala higher order (10): exception handling in Scala

Leetcode buckle classic problem -- 4. Find the median of two positively ordered arrays

Pat class a 1146 topology sequence

Prometheus与Grafana

1 - background project construction
随机推荐
2-unified return class dto object
Segger's hardware anomaly analysis
Android面试题 | 怎么写一个又好又快的日志库?
【暑期每日一题】洛谷 P1601 A+B Problem(高精)
LANDSCAPE
信用卡购物积分
2022年深圳杯A题破除“尖叫效应”与“回声室效应”走出“信息茧房”
Paper reading (62):pointer networks
MapReduce各阶段步骤
【WPF】通过动态/静态资源实现语言切换
Scala 高阶(九):Scala中的模式匹配
Spingboot integrates the quartz framework to realize dynamic scheduled tasks (support real-time addition, deletion, modification and query tasks)
状态机dp三维
logback 中FileAppender具有什么功能呢?
QT连接两个qslite数据库报错QSqlQuery::exec: database not open
Practice of online problem feedback module (XVII): realize the online download function of excel template
Leetcode 209. subarray with the smallest length (2022.07.28)
STM32 operation w25q256 w25q16 SPI flash
mysql 单表最多能存多少数据?
How much data can a single MySQL table store at most?