Question

我使用jQuery的get方法加载一个html文件，并使用jQuery将整个内容放入DOM中。

这个html内容中有很多img标签，我正在加载。

例如，

<img src="warning.png">

warning.png与服务器上的html文件位于同一目录中。

服务器上的目录结构就像这样

/myapp/myfolder/content.html
/myapp/myfolder/warning.png

在具有LTE连接的移动浏览器上，无法加载此html内容中的图像。

但是，当我将img元素的src属性更改为绝对URL时，如下所示

<img src="/myapp/myfolder/warning.png">

无论我使用何种连接，图像始终都能正确加载。（LTE / 3G / wifi /无论如何）

我当然可以用绝对值替换每个img元素的src属性。但是，肯定会在一段时间后变成维护地狱。

我认为这与连接速度和来自服务器的html内容的异步加载之间的关系有关。

有人对此有任何想法吗？

Answer 1

您应该能够创建一个javascript函数，它会自动为您更改图像URL，这样可以省去手动更新网址的麻烦：

$("img").each(function(img){
    $(this).attr("src", "/myapp/myfolder/"+ $(this).attr("src"));
});

您可以在页面底部调用此功能。只需将其包含在您的母版页（或共享的包含文件）中即可。如果您的图片不在一个文件夹中，我建议您修改该功能以了解您当前的网址，并相应地更改“/ myapp / myfolder /”。

我不太了解移动浏览器纠结的原因，但是将链接更改为绝对路径无论如何都是好的做法。