math_number

by bryiantan

HTML

<body>



		<h1 style="position: relative; left: 50px; top: 100px;"><span id="x">6</span></h1>

		<h1 style=" "><span id="y">8</span></h1>

		<h1 style="position: relative; left: 70px; top: -80px; "><span id="z">10</span></h1>


	<button>CLICK</button>




<script> 

var x = document.querySelector("#x"); 
var y = document.querySelector("#y"); 
var z = document.querySelector("#z");	
var btn = document.querySelector("button"); 
btn.addEventListener("click", function(){ 
  x.innerHTML = Math.floor(Math.random() *20 + 1); 
  y.innerHTML = Math.floor(Math.random() *20 + 1); 
  
  let myX = Number(x.innerHTML);
  let myY = Number(y.innerHTML);
  console.log(myX + ' ' + myY);
  z.innerHTML = Math.round(Math.sqrt(myX*myX + myY*myY)); 
}); 

</script>



</body>