有没有办法隐藏卸载的lazyload图像的alt标签？

Question

我使用jQuery Lazyload plugin并且当前将img标记留空，因为当图片尚未加载时，图片alt标记文字可见。

我需要找到一种方法，在图片未加载时不显示alt标签文字。从我在浏览插件页面时所看到的情况来看，似乎没有一种方法可以在加载图像后触发回调函数。我想过尝试隐藏img元素，然后在加载图像后再次显示它，但是无法在没有某种回调的情况下弄清楚如何使它工作。

是否有一种简单的方法可以在图像尚未加载时隐藏替代文字？谢谢！

Answer 1

使用css隐藏替代文字：

img {
color: transparent;
}

图片加载后做的事情：

$("img").on("load", function(){
 console.log("loaded!")
});

Answer 2

下面将保持损坏的图像图标和 Alt 标签中的文本在图像出现之前不显示。您不想使用 Alt=""，因为从谷歌 SEO 的角度来看它很糟糕。 'visibility: hidden' 比 'disply: none' 更受欢迎，因为它会破坏页面。

<style>
    img:not([src]) {
        visibility: hidden;
    }
</style>

Answer 3

最好加载1px x 1px png的透明图像。这样可以使您的HTML有效，并防止替换文字或替换文字的边框出现任何重影。