如何在不改变动态（用户）生成的图像的img标签或HTML的情况下延迟加载图像

Question

我知道有很多方法可以延迟加载图片，但有没有办法在不修改<img>标签的情况下最终做到这一点？

似乎最受欢迎的tool表示无法完成。

HTML无法更改，因为它被用作输入，除非用户这样做，否则无法更改。

赞赏。

Answer 1

不，没有办法做到这一点。如果HTML中包含<img>个标记，并且在其中指定了src属性，则浏览器将在解析页面时开始加载这些标记。因此它们不会被延迟加载，并且您无法使用Javascript来防止这种情况，因为在您的Javascript有机会运行以修改任何内容之前解析页面时，图像的加载将开始或排队。因此，当您尝试使用Javascript影响事物时，图像已经开始加载。

使用CSS隐藏图像（显示：无或可见性：隐藏）不会阻止图像加载，因此您无法以这种方式影响事物。

我并不完全明白您的限制是什么，但延迟加载的一种方法是在原始HTML中没有包含延迟加载<img>标记的内容。然后，您可以在希望它们显示之后使用Javascript插入未修改的HTML块。当然，你必须能够获取或构建HTML＆＃34;的块。你要插入的内容。

另一种可能性（更多的是延伸）是加载一个＆＃34;容器＆＃34;页面中没有真实内容，然后使用Ajax动态获取要显示的页面HTML，然后使用Javascript修改HTML（以修改HTML中的<img>标记）将HTML插入容器中。

变得更加狂野，您可以使用代理服务器对原始HTML进行必要的修改以配置延迟加载（修改<img>标记）。