IE 11 automatically adds width / height attribute to image object

Question

IE 11 automatically adds width / height attribute to image object

Today I ran into the issue of fixing IE 11 issue on our website that was causing some images to display incorrectly.

So, run this in IE 11:

var img = new Image();
img.src = "http://placehold.it/900x450";
document.body.appendChild(img);

var img2 = document.createElement('img');
img2.src = "http://placehold.it/900x450";
document.body.appendChild(img2);

It seems like you need to get two different outputs. An image created by instantiating an image object has a width and height attribute created with the document.createElement function.

This is what I see (JSFiddle here) :

jsfiddle exposing the problem

I was also able to replicate the issue by creating a simple HTML page (just to be absolutely sure this isn't some kind of magic done by the JSFiddle):

<!doctype html>
<html>
  <head>
  </head>
  <body>
    <script type="text/javascript">
      var img = new Image();
      var img2 = document.createElement('img');

      img.src = "http://placehold.it/900x450";
      document.body.appendChild(img);

      img2.src = "http://placehold.it/900x450";
      document.body.appendChild(img2);
    </script>
  </body>
</html>