i try to made a simple game, create 9 divs with various numbers in each one(1-9),
the mission is to delete with on mouse over command only the divs in which the number will be less than in other div’s.
HTML
<html>
<head>
<link rel = "stylesheet" href = "style.css">
</head>
<body onload = "myFunction()" id = "body">
<div id = 'play_ground'>
</div>
<b2>PLAY<b2>
<script src = "Game-9.js"></script>
</body>
</html>
JS
var play_box = document.getElementById('play_ground');
var numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log (numbers)
function myFunction(){
shuffle(numbers);
for (var i = 0; i < 9; i++){
play_box.innerHTML += '<div class="box" class ="display" onmouseover="myScript('+ i +')">'+ numbers[i] +'</div>';
}
}
function shuffle(array) {
for (var i = array.length - 1; i > 0; i--) {
var j = Math.floor(Math.random() * (i + 1));
var temp = array[i];
array[i] = array[j];
array[j] = temp;
}
}
function myScript(i){
console.log (numbers)
var box_i = document.getElementsByClassName('box')[i];
var number = Math.min(...numbers);
for(box_i == number ; number++){
if(numbers != 0){
console.log (number);
index = numbers.indexOf(box_i);
numbers.splice(index, 1);
box.style["display"] = "none";
console.log (numbers);
}
}
}
The error comes from here-> for(box_i == number ; number++);
function myScript(i)-> from here i need to create a logic from which it will delete(or add css parameter) on the exact div(onmouseover command) in which number will be smaller than in other div’s