javascript - img 标签是否向服务器发出异步请求？

Question

如果在呈现页面后我从 javascript 更改 img 标签的 src，例如：

function changeImage(){
  img.src = 'getImage?imgId=232132'; //getImage is calling doGet() Method of Servlet   with  response content type "image/jpeg"
}

这是进行异步调用并加载图像吗？

Answer 1

是的。由 DOM 修改触发的内容加载不会阻塞 JavaScript。

Answer 2

是的，调用是异步的，除非它不是真正的远程调用，因为图像在缓存中（在这种情况下，图像将在脚本的下一行执行之前加载）。

如果您想在完成时收到通知，请执行以下操作：

img.onload = function(){alert('loaded!')};
img.src = 'getImage?imgId=232132';

Answer 3

最简单的答案是肯定的，它将异步发生。但是，还有更多内容。

这个想法是，您在 javascript 期间所做的只是修改它应该显示的页面的模型 (DOM)。浏览器必须确保页面是根据模型中的新规范呈现的，基本上，在这种情况下，包括下载图像。但是，您的浏览器执行此渲染的方式由浏览器决定，尽管它不应该阻止您的 javascript。

事实上，我看到许多主要浏览器处理您所描述的情况的方式是确实会有对图像的异步请求，但直到您的 javascript 完成运行之后。换句话说，如果你用一个忙碌的等待（while (true) {}）来跟进它，图像根本不会被加载。但是，如果您要在更改src对于图像，页面会解释新的 src 并完成对图像的异步请求，但不能保证图像在第二秒过去时是否已经完成加载。但是，其他浏览器可能会以不同的方式执行此操作，最好不要依赖除您知道是正确的行为之外的任何行为（它不会阻止您的 javascript，并且如果您想在完成加载后做某事，您甚至应该使用适当的 DOM）。

Answer 4

请设置您的文件头。如果你使用 php，试试这个：

<?php
header("Content-type: image/jpeg");
?>

祝你好运