If語句在Javascript中旋轉

Question

我正在改變旋轉當我點擊一個div。爲什麼當我點擊div時我的div不旋轉？ if語句有什麼問題嗎？

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>