用Image对象加载的图片怎么放到页面中去？

Question

用Image对象加载的图片怎么放到页面中去？

比如这样：

   var preLoad = function() {
        var imagesList = ['images/1.jpg', 'images/2.jpg', 'images/3.jpg'];

        for (var i = 0; i < imagesList.length; i++) {
            var imgObject = new Image();
            imgObject.src = imagesList[i];
        }
    }();

imgObject对象中的图片此时已经预加载了，但是图片怎样插入到页面标签中呢？
没有用过new Image()做预加载,球解答

Answer 1

var img = new Image();
var div = document.getElementById('foo');

img.onload = function() {
  div.appendChild(img);
};

img.src = 'path/to/image.jpg';

Answer 2

var    imgs = [
            'images/img1.jpg',
            'images/img2.jpg',
            'images/img1.jpg',
            'images/img2.jpg',
            'images/img3.jpg'
        ];
        var index = 0, 
            len = imgs.length,
            count = 0,
            $progress = $('.loading');
        
        $.each(imgs,function(i,src){
            var imgObj = new Image();
            $(imgObj).on('load',function(){
                $progress.html(Math.round((count + 1) / len * 100) + '%' );
                if( count >= len - 1 ){
                    $('.progress').hide();
                    document.title = '1/' + len;
                }
                count ++;
            });
            imgObj.src = src;
        });

Answer 3

https://github.com/xkh/preloa... 试试这个 js、css、img都可以