我制作了一个汽车经销商页面。我将有关汽车的数据存储在对象数组中，然后循环遍历它以将数据插入到 HTML 文件中以显示在页面上。效果很好。
当我尝试使用相交观察器添加延迟加载函数时，问题就出现了。这些内容已正确放入页面，但交叉点观察者看不到图像，也不会加载它们。
这里是 codepen https://codepen.io/russiandobby/pen/xxxJvxv?editors=0010 的链接，如果将 data-src 更改为 src 它将起作用。
我怎样才能让它工作，这样我就可以进行延迟加载。
<img data-src="${car.img}" alt="jag1" class="card-img-top car-img popup-img">
最佳答案
你的主要代码没问题。
唯一的问题是它在错误的时间运行。当 DOM 生成代码在 DOMContentLoaded 上运行时，您尝试立即附加观察者，因此 DOM 中还没有图像。
您还需要将观察者代码放入 DOMContentLoaded 中，或者创建一个方法并从那里调用它。
更新代码:https://codepen.io/gpetrioli/pen/XWWBvQm?editors=0010
(您的 codepen 也会失败，因为您使用 jquery 插件而不包含 jQuery 库)
关于javascript - 交叉口观察器不适用于通过 JS 添加的元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58813478/