背景图像的img标签元素与div之间的性能差异？

本文介绍了背景图像的img标签元素与div之间的性能差异？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 在img标签与带图像背景的div中显示图像时，在性能或加载/缓存行为方面是否存在差异？

我的例子：

我有一个网站，其中我将需要使用JavaScript动态加载。一个问题是，我需要将图像定位到元素的右侧，以便我可以做出很好的清除效果。正因为如此，我使用的背景图像定位正确的div。无法弄清楚如何用img做到这一点，但由于divs正在为我工​​作，我不知道这是否会影响...

解决方案

AFAIK，浏览器缓存图像相同，无论他们在DIV或IMG。无论如何，我认为这种情况下，特定性能被定义为每个渲染引擎内部的实现细节（可能还有围绕它们构建的浏览器）。因此，作为设计者/开发者，它们都不在我们的控制之下，并且可能随浏览器和浏览器以及版本的不同而改变。换句话说，我不会花太多时间担心它。

Are there any differences in performance or load/caching behavior when displaying images in img tags vs divs with image backgrounds?

My example:

I have a site with many overlapping images, some of which I will need to load dynamically with javascript. One issue is that I need to anchor the images to the right of the element, so that I can do a nice wipe-to-right effect. Because of this I was using a div with background image positioned right. Couldn't figure out how to do this with img but since divs are working for me I didn't know if this would matter...

解决方案

AFAIK, browsers cache images the same whether they're in a DIV or an IMG. In any case, I think this one of those cases where specific performance is defined as an implementation detail internal to each rendering engine (and possibly the browsers built around them). As such, it's both out of our control as designers/developers and subject to change from browser to browser and version to version. In other words, I wouldn't spend too much time worrying about it.