当我单击按钮时，我想随机旋转“ div”

Question

"Pijl" is the div I want to rotate randomly. "Knop" is the button that is needed to make the div rotate.

var pijl = document.querySelector("#arrow");
var knop = document.querySelector("#bottom");
var spin = Math.round(Math.random() * (360));

knop.addEventListener("click", draai);
function draai(evt) {
   pijl.rotate(spin + "deg");
}

Answer 1

There is no rotate() method, you need apply the css style property instead. You can refer the following question : How to set the style -webkit-transform dynamically using JavaScript? or Rotate a div using javascript . Also you need to move the variable spin inside the function if you want to generate random values on each click.

 var pijl = document.querySelector("#arrow"); var knop = document.querySelector("#bottom"); knop.addEventListener("click", draai); function draai(evt) { var spin = Math.round(Math.random() * (360)); pijl.style.transform = 'rotate(' + spin + 'deg)'; } 

 <div id="arrow" style="margin:50px;width:50px;height:20px;background:red">arrow</div> <button id="bottom">click</button>