【问题标题】:Determining when images load in HTML?确定何时在 HTML 中加载图像?
【发布时间】:2010-11-18 01:27:44
【问题描述】:
  1. 有没有办法确定何时 特定的图像资产已 加载,无论是在标签中还是作为 背景?
  2. 有没有 确定所有图像何时进入的方法 页面已加载?

如果没有,是否有任何 jquery//替代图像加载技术可以实现这一点?

谢谢

【问题讨论】:

    标签: javascript jquery html image


    【解决方案1】:

    1) 使用onload 事件处理程序。

    2) 使用onload 事件将变量imagesloaded 加1,当imagesloaded == document.getElementsByTagName('img').length 时所有图像都已加载

    您可能还想使用onerror 事件,该事件在图像无法加载(出于任何原因)时触发,以及onabort 用于在用户中止连接时触发。

    【讨论】:

    • 这仅适用于 标签,不适用于 CSS 背景 - 我认为无法确定这些。但是您可以使用display: none 获得一个虚拟图像 - 如果在多个地方使用相同的源,那么它的所有实例都会同时加载。
    • 有趣——那么什么类型的元素会触发 onload——只有 img 和 windows?我应该将我的处理程序附加到窗口上,然后假设每个 onload 事件都来自 imgs?
    • 任何需要从服务器获取媒体的东西都会触发 onload - 这包括图像、新的 HTML5 音频和视频标签(推荐使用 oncanplay 和 oncanplaythrough,但 Google Chrome 不支持),我认为它也适用于脚本和链接标签,尽管我不是 100% 确定这一点。
    【解决方案2】:

    处理 (1) 图像或 (2) 窗口的 onload 事件。

    【讨论】:

    • document 没有加载事件,window 有;)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2010-12-05
    • 1970-01-01
    • 1970-01-01
    • 2019-06-20
    • 1970-01-01
    • 2011-04-04
    相关资源
    最近更新 更多