Question

当用户点击九个按钮中的一个时，带有一些文字和图片的div（原始样式为display：none）将传播到屏幕;单击其中一个按钮会切换到相应的div。

现在，交换div看起来如下：

<div class="next-slide-container" id="base-soft">
   Some Text<br>
   Some Text<br>
   Lines<br>
   Lines<br>
   <br>
   <!-- an image loaded in here -->
</div>

现在，我开始怀疑如果页面一次加载所有这些div和它们各自的图像，虽然是隐藏的，但它会不必要地增加加载时间。所以，我去了谷歌和Stack Overflow找到一些信息，并在这里找到了一个很好的主题：

Does "display:none" prevent an image from loading?

这提供了一些很好的见解，以及如何在页面启动时无法加载图片，但是对最佳答案进行了编辑，否认了这一点，＆＃34;浏览器变得越来越聪明。今天您的浏览器（取决于版本）可能会跳过图像加载，如果它可以确定它没用。＆＃34;

那么，为什么我有点重复这个话题是因为那篇顶级帖子大约是20个月之前;是否有更好的替代方案，在该帖子中建议的内容，＆＃34;将IMG src属性设置为＆＃34;数据：＆＃34;或者＆＃34;关于：空白＆＃34;＆＃34;？另外，我正在寻求关于处理动态div加载的最佳实践方法的建议。谢谢！

处理动态加载/交换图像的有效方法是什么？

0 个答案: