预加载图像中的相对路径

Relative path in preloading images

本文关键字：相对 路径 加载 图像      更新时间：2023-09-26
这可能是

一个愚蠢的问题，但我真的很困惑，想从了解这一点的人那里得到一个意见。

预加载图像可以通过JavaScript或CSS完成（仅举两个我正在考虑的）。我阅读了教程，如果浏览器再次找到相同的图像路径，它将呈现缓存的图像。

如果我预加载图像，例如：

<img src="../images/bg.jpg" alt="background" width="1" height="1" style='display:none' />

和

<img src="images/bg.jpg" alt="background" />

与javascript类似：

function preload(arrayOfImages) {
    $(arrayOfImages).each(function(){
        $('<img/>')[0].src = this;
    });
}
// Usage:
preload([
    '../img/imageName.jpg',
    'img/imageName.jpg' // case when using this script in a different hierarchical level)
]);

第二次调用是否会导致从缓存版本呈现图像，或者由于指定的图像路径不同（尽管最终它引用同一文件）而不起作用。

提前谢谢。

我意识到这是旧的，但我总是从实习生那里得到这个 - 所以在这里......

即使 onload 函数在 JS 文件中要求/告诉浏览器查找图像;它是浏览器寻找图像并告诉 JS 图像已加载。

因此，您在JS中的图像路径应该与您在HTML中输入的图像路径相同。

PS：我注意到在您的HTML中图像文件夹是"/images"，而在您的JS中，该文件夹是"/img"

相关文章：