如何使用XMLHttpRequest获取.jpg图像

How to GET a .jpg image using XMLHttpRequest?

本文关键字：jpg 图像 获取 XMLHttpRequest 何使用      更新时间：2023-09-26

例如，使用此方法，我可以轻松地获取.txt文件，但当我尝试获取图像时，它会发送一堆未编码的字母，如下所示�@R�J�,我怎样才能得到图像的原样？

<!DOCTYPE html>
<html>
<body>
<h1 id="demo">Let AJAX change this text</h1>
<button id="button">Change Content</button>
<script>
document.getElementById('button').addEventListener('click', function(){
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      document.getElementById("demo").innerHTML = xhttp.responseText;
    }
  };
  xhttp.open("GET", "images.jpg", true);
  xhttp.send();
});
</script>
</body>
</html>

编辑：

事实上，我已经发现我可以做这个document.getElementById("demo").setAttribute('src', 'https://placeimg.com/640/480/any');

以及在HTML <img id="demo" src="" /> 中

它对外部资源很有效，但我的服务器中的图像呢？

如果映像在您的服务器上，您可以通过绝对地址src="http://localhost:portnumber/pathOfTheImage/image.png"或相对于您的站点文件夹src="/images/image.png"获取它。

相关文章：