Question

我想显示用Javascript编写的对象的image属性。我试图使用以下代码，但它不想为我工作。函数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);
    }

提前致谢！

Answer 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>

如何在div中显示js对象的属性图像？

1 个答案: