<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.box{
height: 200px;
border: 1px solid grey;
padding: 10px;
}
img{
width: 180px;
height: 180px;
}
</style></head>
<body>
<button>添加</button>
<div class="box"></div>
<script>
var i=1;
//点击添加按钮，在div中插入一张图片
var butn=document.querySelector("button");
var box=document.querySelector(".box");
butn.onclick=function(){
// 创建图片
var img=document.createElement("img");
img.src="images/"+i+".png";
//为图片追加点击事件
img.onclick=function(){
this.style.width=0;
this.style.height=0;
};
//添加到div中
box.appendChild(img);
i++;
};
</script></body>
</html>