如何使用Javascript函数连续旋转照片

Question

我试图找出逻辑连续旋转Javascript中的图像。到目前为止，我已经达到了这个代码。img1是图像的id，到目前为止它工作，但它只旋转一次。我怎么让它每次点击都旋转呢?我使用onclick事件。

function rotateProfilePic() {
var image = document.getElementById('img1');
image.style.transform = "rotate(180deg)";
} 

对不起，如果这个问题对某人来说太简单了，我是Web编程的初学者。

Answer 1

将函数设置为image:

const imgTag = document.getElementById("img1");
const rotateStep = 180; // rotation size
let curImgAngle = 0;

function rotateProfilePic() {
curImgAngle += rotateStep;
imgTag.style.transform = `rotate(${curImgAngle}deg)`;
} 
imgTag.addEventListener("click", rotateProfilePic);