Javascript 在html和css中加载图像的顺序

我可以通过编程（或者，正如我们所说的

html

和

css

，语义）来决定图像加载的顺序吗

我想先加载背景图像，然后在

$（窗口）上调用som javascript。加载

，将其留在浏览器上是否足够（例如身体背景在

40

，其他图像稍后在css文件中），或者我必须使用javascript（如果是，是否有一些简单的解决方案？）

多谢各位

---

编辑：原因是我可以在加载图像时显示“加载…”通知，但首先加载的部分在至少看不到背景的情况下是没有意义的，因此必须首先加载背景。

浏览器的解析引擎找到url后，图像请求立即启动，但它不能保证在其他资源完成下载之前被下载。我不知道为什么在加载其他资源之前需要完全下载后台

---

哦，一旦下载了所有资源，就会触发整个文档的onload事件。

使用javascript动态加载图像怎么样？然后您可以确定加载的顺序。确保先加载脚本。

没有可靠的方法。使用JavaScript意味着，对于禁用脚本的用户或不支持脚本的浏览器，将永远不会加载图像

一个页面的几乎所有外部资源（其中一个例外是脚本）都是异步加载的，从浏览器解析它们时开始加载。这意味着首先加载的很可能是较小的文件，而较大的文件需要较长的时间才能下载和显示

---

您可以将所有较小的图像合并到一个图像中，这将使文件大小变大，以便它们可以同时显示（而不是连续显示），但我不会全心全意地将其推荐给任何普通页面。这个过程只涉及调整背景位置，以仅显示您想要从集合中获取的图像。如果集合大小大于背景图像，并且背景图像首先开始下载，则背景很有可能在图像之前渲染。

您可以在第一个图像上使用onload事件来加载下一个图像），依此类推

img1.src = 'url1';
img1.onload = function(){
  ...
  img2.src = 'url2';
  img2.onload = function(){
    ...
  }
}

---

我发现这是一个有效的技巧：

使用早期放置在DOM中的JS预加载图像：

<script type="text/javascript">
    (new Image()).src="../img/loader.gif";
</script>

（new Image（））.src=“../img/loader.gif”；

首先将要加载的元素放在CSS中尽可能高的位置

通过将CSS放在DOM的更高位置，尽早加载CSS

---

关闭JavaScript的用户将永远看不到它们。@Andy E-是的，这是一个问题大多数用户（抱歉）没有足够的智能来关闭java脚本，一些浏览器safari和android浏览器使它成为一个真正的任务。原因是我可以在加载图像时显示“加载…”通知，但首先加载的部分至少在看不到背景的情况下是没有意义的。我实际上成功地使用了Sprite技术，将颜色相似的图像分组到PNG-8:）如果你足够聪明，可以在浏览器中禁用JavaScript，那么你足够聪明，可以让它在你选择的网站上看到丰富的内容：）@MichaelButler，谢谢，下次有人用“无JS用户”来攻击我时，我会用这个短语，这有点老了，但这里的风险是img1失败。相反，您可以在每个加载图像（以及失败的图像）上设置一个计数器标志，然后按顺序显示它们