Jquery 如何使用类在div上预加载多个背景图像

使用jQuery在带有类的div上预加载背景图像的最佳方法是什么

<div id="wrapper" class="first">

</div>


.first {background:url(/image.jpg) repeat-x top center}

.first{background:url（/image.jpg）repeat-x top-center}

只需使用Image对象或隐藏DIV中的IMG标记将其作为常规图像预加载。然后，当您将工作DIV的类更改为具有某个预加载图像的CSS背景的类时，它将从客户端缓存中提取

.preload { display: none; }
...
<div>
    <img src="a.png" class="preload" />
    <img src="b.png" class="preload" />
</div>

.preload{display:none；}
...

如果希望在不更改HTML标记的情况下预加载，可以使用jQuery：

$(function(){
    $('<img/>')[0].src = "/image.jpg";
});

$（函数（）{
$（'您可以使用整个图像，而不是使用多个单独的图像文件，还可以使用CSS背景位置功能的xpos和ypos参数。在这种情况下，只加载一个图像文件，并且只加载一次。让CSS和类处理其余的内容。下面是一个示例

/*this is the style*/
<style type="text/css">
    .first {
        background: url(.....) no-repeat 0px 0px;
    }
    .second {
        background: url(.....) no-repeat -200px -200px;
    }
</style>
<div id="wrapper" class="first"></div>

/*这就是风格*/
.首先{
背景：url（…）不重复0px 0px；
}
.第二{
背景：url（…）无重复-200px-200px；
}
它们是背景图像。我没有在html中使用
图像标记markup@BeEasy这不会向您的标记中添加任何代码。可能您误读了我的回答：
如果您希望在不更改HTML标记的情况下预加载，它们是背景图像。我没有在HTML中使用
图像标记markup@BeEasy-你的问题是“什么是最好的方式…”，我的观点是使用IMG标签是最好的方式（即使它们是背景图像）。有几种不同的方法可以做到这一点，但没有办法只强制CSS为您预加载图像。我不想避免这种情况，因为图像是
2000 x 1300
好的。我明白你的意思。这种情况下你只需要使用一个div元素吗？除非你这样做，否则你可以创建多个div元素并将它们隐藏起来，直到需要它们。我很抱歉使用jquery将类添加到
div#wrapper
每个类都有自己的背景图像。我想预加载多个类（背景图像），以便在类更改之前已加载背景图像。