繁体   English   中英

如何在 HTML 字符串延迟加载中制作所有图像?

[英]How to make all Images in an HTML String Lazy Load?

我们的网站将我们页面的 HTML 内容存储在我们的数据库中,就像一个 CMS。

我想知道如何强制该字符串中的任何图像延迟加载,但我也想包含图像的一个版本,以防用户未启用 javascript。

有没有办法替换字符串中的所有图像,如下所示:
查找: <img src="URL" class="CLASSES" alt="ALT" title="TITLE">
替换: <img data-src="URL" class="CLASSES lazy" alt="ALT" title="TITLE"><nosource><img src="URL" class="CLASSES" alt="ALT" title="TITLE"></nosource>

或者,我们使用 TinyMCE 作为 HTML 编辑器。 有没有办法将我们内容中的任何图像保存为<img data-src="URL" class="CLASSES lazy" alt="ALT" title="TITLE"><nosource><img src="URL" class="CLASSES" alt="ALT" title="TITLE"></nosource> ,但将内容中的图像显示为<img src="URL" class="CLASSES" alt="ALT" title="TITLE">什么时候在编辑器中显示?

@dev101 提供的这篇文章创造了奇迹: https ://tehnoblog.org/wordpress-theme-image-lazyload-tutorial-with-adaptive-height-placeholders/

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM