如果在JavaScript中旋转旋转

Question

当我单击DIV时，我正在处理更改的旋转。当我单击DIV时，为什么我的Div不旋转？if statement有问题吗？

function blog() {
  var i = document.getElementById('imgblog').style.transform;
  if (i == "rotate(180deg)") {
    document.getElementById('imgblog').style.transform == "rotate(0deg)";
  } else {
    document.getElementById('imgblog').style.transform == "rotate(180deg)";
  }
}

#option #imgblog {
  height: 20px;
  transform: rotate(180deg);
  transition: 0.3s;
  margin-top: 1px;
  float: right;
}

<div id="option" onclick="blog()">
  <img id="imgblog" src="https://upload.wikimedia.org/wikipedia/commons/3/35/Arrow_facing_right_-_Red.svg">
  <h1> BLOG </h1>
</div>

Answer 1

简化了您的代码以切换触发旋转的类。

#option #imgblog {
  height: 20px;
  transform: rotate(180deg);
  transition: 0.3s;
  margin-top: 1px;
  float: right;
}
#option #imgblog.norotate {
  transform: rotate(0);
}

<div id="option" onclick="blog()">
  <img id="imgblog" src="http://kenwheeler.github.io/slick/img/fonz1.png">
  <h1> BLOG </h1>
</div>
<script>
  function blog() {
    var i = document.getElementById('imgblog');
    i.classList.toggle('norotate');
  }
</script>