0

我想显示用 Javascript 编写的对象的图像属性。我尝试使用以下代码,但它不想为我工作。函数 show_image 来自这里,所以我知道它可以工作(当我尝试使用“原始”图像文件时它也可以工作。)我还希望能够选择在某个 div 中应该显示该图像的位置. 我该怎么做呢?我想附加的 div 也可以通过它的类名来识别,我想我应该使用“getElementById”,但我将如何做到这一点是个谜。

该图像确实显示为一个空方块,但它显示“[object%20HTMLImageElement]”。

这是我当前的脚本代码:

var img = new Image();
    img.src = 'imagehere';

    card=new Object();
    card.backImage=img;
    card.height=100;
    card.width=100;

    show_image(card.backImage, 
                     276, 
                     110, 
                     'Whateverthenameis');

    function show_image(src, width, height, alt) {
        var img = document.createElement("img");
        img.src = src;
        img.width = width;
        img.height = height;
        img.alt = alt;

        document.body.appendChild(img);
    }

提前致谢!

4

1 回答 1

1

将创建的Image附加到 DOM 的东西是Node.appendChild. 在您的示例中,您使用的是document.body.appendChild(img);,因此这是您需要更改的行。您可能还想为您的函数添加另一个参数,让您也可以传递您想要附加图像的节点。

例如,您生成的函数可能具有以下形式

function show_image(src, width, height, alt, parent) {
    var img = document.createElement("img");
    img.src = src;
    img.width = width;
    img.height = height;
    img.alt = alt;

    parent.appendChild(img);
}

并由

show_image(
    'http://yummy.p.ie/photo.jpg',      // url
    100, 100, 'PIE!',                   // width, height, alt
    document.getElementById('pieShelf') // parent
);

使用一些看起来像的HTML

<div id="pieShelf">Look at my yummy pie</div>
于 2013-05-24T19:43:23.933 回答