使用Javascript将图标旋转180度

<div id="icon"></div>

#icon {
  width: 100px;
  height: 100px;
  background-color: #000;
  transform: rotate(0deg);
  transition: transform 0.3s ease; /* 添加过渡效果，使旋转更平滑 */
}

var icon = document.getElementById("icon");

// 点击图标时触发旋转动画
icon.addEventListener("click", function() {
  if (icon.style.transform === "rotate(180deg)") {
    icon.style.transform = "rotate(0deg)";
  } else {
    icon.style.transform = "rotate(180deg)";
  }
});