肯定的是这个不是唯一的方法。只是本人在实际项目中的一个解决方法。
众所周知,object-fit是个非常好的CSS3属性,可以将各种元素相对父级进行contain/cover操作。
尤其做响应式网站的时候非常好用。但问题是IE不支持。
那么针对IE,下面有个方法:

原理:判断如果是IE,将图片赋给父级元素作为背景,然后将图片移除。以达到在IE上使用background-size时有跟object-fit同样的效果。

用法:

DOM结构大概是:
<div class="hasbg">
<img src="">
</div>
js部分代码:
 function ieFix() {
    if (!!window.ActiveXObject || 'ActiveXObject' in window) {
        $('html').addClass('is-ie');
        if ($('.hasbg').length) {
            $('.hasbg').each(function () {
                var $this = $(this);
                var $src = $this.find('img').attr('src');
                if ($src.length) {
                    $this.css({
                        'background-image': function () {
                            $this.find('img').remove();
                            return 'url(' + $src + ')';
                        }
                    });
                }
            });
        }
    }
} 

可以看出,首先判断了有没有hasbg这样的一个class。
如果有,进一步执行代码。
如果是IE浏览器,它将会把img的图片赋给hasbg作为背景。而后将img移除。
到此,图片转移成背景的操作就完成了。
 
还差一点操作,就是对背景图片的位置进行适当操作。

样式可以是:
.hasbg {
    background-position: center center;
    background-attachment: scroll;
    background-size: contain;
    -webkit-background-size: contain;
    background-repeat: no-repeat;
}