Вставка изображения в HTML с помощью JS

Можно ли как-то организовать вставку изображения, загруженного с помощью input, в HTML-страницу с помощью JavaScript?


Ответы (1 шт):

Автор решения: Vadim.Sharoikin

window.addEventListener('load', function() {
  document.querySelector('input[type="file"]').addEventListener('change', function() {
      if (this.files && this.files[0]) {
          var img = document.querySelector('img');  
          img.src = URL.createObjectURL(this.files[0]); 
          img.onload = imageIsLoaded;
      }
  });
});

function imageIsLoaded() { 
  alert(this.src); 
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='file' />
<br><img id="myImg" src="#" alt="your image" height=200 width=100>

→ Ссылка