动态加载图片仅适用于Chrome

Question

image = document.createElement("image");
image.src ="http://jsfiddle.net/img/logo.png";
e = document.getElementById('id');
$(image).load(function() {
    $(image).hide();
    e.appendChild(image);
    $(image).fadeIn(1000);
});     

是什么让此代码仅在Chrome中运行？ http://jsfiddle.net/QLFf3/1/

Answer 1

您需要创建一个“img”元素。没有称为“图像”的原生元素

修改的 由于看起来你正在使用jQuery，你可以这样做：

$('<img/>')
    .attr('src', 'http://jsfiddle.net/img/logo.png')
    .css({display:'none'})
    .appendTo('body')
    .load(function(){
        $(this).fadeIn(1000);
    });

当然，.appendTo（）位需要针对您所针对的DOM中的任何位置。

Answer 2

你可以使用

image = new Image();

而不是

image = document.createElement("image");

请参阅http://bytes.com/topic/javascript/answers/775889-document-createelement-img-vs-new-image

Answer 3

检查this。

尝试，image = new Image();