网页通常包含许多图片,这些图片会影响数据使用量和页面加载速度。大多数图片都在屏幕外(非关键),需要用户交互,如滚动才能查看。
加载属性
loading属性在元素上,或者loading属性在
html
当急切加载的内容全部加载完毕后,load 事件就会触发。此时,有可能(甚至很可能)可视视窗内存在一些尚未加载的延迟加载图片或 iframe。
可以通过检查图片的布尔值complete属性的值来确定图片是否已加载完毕。
交叉观察者 API
交叉观察者允许用户知道观察到的元素何时进入或退出浏览器的视窗。
事件处理程序
当浏览器兼容性至关重要时,有一些选择
交叉观察者 polyfill
回退到滚动、调整大小或方向更改事件处理程序来确定特定元素是否在视窗内