php图片延迟加载、懒加载的方法?

发布于 2022-09-01 19:31:01 字数 213 浏览 30 评论 0

我现在的做法是,将图片的src用占位符图片代替,并使用data-src属性保存真实的图片地址,然后监控window的scroll事件,当图片出现在屏幕中时,就将data-src的值赋值给src。

但是这种做法不太方便,比如我现在不想延迟加载了,那么对于那些已经延迟加载的文章改起来就非常麻烦,比如我想在搜索引擎访问的时候不用延迟加载,用户访问的时候用延迟加载,不知道怎样做可以方便的进行切换呢?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

纸伞微斜 2022-09-08 19:31:01

img = new Image(); img.src = 'http://www.helloworld.com/test.jpg'; img.onload = function() { var imageContainer = document.getElementById('imgContainer'); imageContainer.appendChild(img); }

剪不断理还乱 2022-09-08 19:31:01

你可以在数据库里存储原样的也就是src的内容,在输出之前统一加上过滤器,自动替换为data-src的形式。这样当你想恢复原样的时候,只需要把过滤器调用删掉就行了。

function add_lazy_load_filter($html) {
    return preg_replace("/<img\s+src=\"([^\"]+)\"\s*\/?>/is", "<img data-src=\"\\1\">", $html);
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文