Question

我通过javascript在我的网站上放置了一些图片。这是我的javascript中的代码：

 var fruit = ['apple.png', 'banana.png', 'orange.png'];
var animals = ['hawk.png'];
var imageDiv = document.getElementById('imageDiv');



for( var i = 0; i < (fruit.length ); i++){

    var imgElement = document.createElement('img');
    imgElement.setAttribute('id', fruit[i]);
    imgElement.setAttribute('src', 'Images/' + fruit[i]);
    imageDiv.appendChild(imgElement);

}

for( var j = 0; j < (animals.length ); j++){

    var imgElement2 = document.createElement('img');
    imgElement2.setAttribute('id', animals[j]);
    imgElement2.setAttribute('src', 'Images/' + animals[j]);
    imageDiv.appendChild(imgElement2);
}

我在html中唯一拥有的是一个名为imageDiv的空div。如何制作var fruit可点击的图片？

Answer 1

要在有人点击图片时触发某些功能，请使用点击事件：

imgElement.onclick = function() {
    //This code will be run on click.
};

Answer 2

这应该有效。你需要为水果做同样的事情

for( var j = 0; j < (animals.length ); j++){
    var link = document.createElement('a');
    link.setAttribute('href', <your link>);
    var imgElement2 = document.createElement('img');
    imgElement2.setAttribute('id', animals[j]);
    imgElement2.setAttribute('src', 'Images/' + animals[j]);
    link.appendChild(imgElement2);
    imageDiv.appendChild(link);
}

如何在javascript中使用图像制作按钮？

2 个答案: