使用javascript在页面中生成100个图片,并用js对图片添加事件
时间: 2024-04-16 15:23:56 浏览: 12
要在页面中生成100个图片并为它们添加事件,可以使用以下代码:
```javascript
// 创建图片元素的函数
function createImageElement() {
var img = document.createElement("img");
img.src = "image.jpg"; // 图片的路径
img.addEventListener("click", function() {
// 在这里添加点击事件的处理逻辑
console.log("图片被点击了");
});
return img;
}
// 获取要插入图片的容器
var container = document.getElementById("image-container"); // 替换为实际的容器ID
// 循环生成100个图片元素并插入到容器中
for (var i = 0; i < 100; i++) {
var image = createImageElement();
container.appendChild(image);
}
```
在上面的代码中,我们在 `createImageElement` 函数中为每个图片元素添加了一个点击事件的监听器。你可以在监听器中编写自己的事件处理逻辑。在此示例中,我只是简单地在控制台输出了一条消息"图片被点击了"。你可以根据自己的需求在事件处理逻辑中进行更多操作。同样,请将代码中的 "image.jpg" 替换为实际的图片路径,以及 "image-container" 替换为实际的容器ID。这样就能在页面中生成100个带有点击事件的图片元素了。