我有一个问题,我有一个图库,当您单击图片时,图片想要变大,如果您再次单击,图片必须变小,但它不起作用,有人可以修复我的代码?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="content">
<img class="pic" src="https://picsum.photos/id/200/200/200" alt="">
<img class="pic" src="https://picsum.photos/id/400/200/200" alt="">
<img class="pic" src="https://picsum.photos/id/201/200/200" alt="">
<img class="pic" src="https://picsum.photos/id/450/200/200" alt="">
</div>
<script>
var img=document.getElementsByClassname("pic");
for(i=0;i<img.length;i++){
img[i].addEventListener("click",(event)=>{
var evento=event.target;
evento.style.width="700px"
})
}
img[i].addEventListener("click",(eventen)=>{
var eventen=eventen.target;
eventen.style.width="200px"
})
</script>
</body>
</html>