Research about Randomising , need assistance here.
I am currently, research the randomizing,
and i try to make a minesweeper game to play around with my new function.
My plan is lay ten mines inside the mine table
but after i run my code , i got some unexpected problem which is i can't have
ten random mines everytime i refresh it.
I have fix some loop and code but the problem is still here.
My current lay mines code looks like this :
<script type="text/javascript">
function addmines (x) {
var n = 10; //number of mines
var mines = []; //an empty array
while (n>0) {
var row = Math.floor(1+Math.random()*10);
var col = Math.floor(1+Math.random()*10);
if (row >= 0 && row < 10){
if (col >= 0 && col < 10) {
var id = "r"+ row + "c" + col;
n++;
var a = document.createElement("img");
a.src = "mine32.gif";
a.height = 30;
a.width = 30;
document.getElementById(id).appendChild(a);
}
}
}
return x;
}
</script>
And this is my tables
//Creates Table
document.write('<table>');
//for loop that creates the row, increments from 0 to 9 each time it reiterates
for (var row=0; row<9; row++) {
//creates the table row
document.write('<tr>');
//a nested for loop that reiterates 9 times creating the <td>'s and then exits to the parent for loop.
for (var col=0; col<9; col++) {
//references all the <td>'s with a specific id attribute.
document.write('<td id="r', row, 'c', col, '">');
//document.write(' ');
//closes the <td>
document.write('</td>');
}
//closes the <tr> or row in plain English
document.write('</tr>');
}
//closes the <table> tag
document.write('</table>');
addmines();
Can someone give me suggestion and assistance that allow me to correct my mistakes please?
There are several issues. First of all, there's an error: you're trying to add an image to a <td> element that doesn't exist. So either too few <td>s are created or the numbers for your random row and column are too high or low. (Always check the console!)
Secondly you're saying n++ instead of n-- which means that the while loop will loop forever. (n>0 will always be true.)
Some unnecessary things that can be removed are the empty mines array and these checks:
Code:
if (row >= 0 && row < 10){
if (col >= 0 && col < 10) {
because you already know row and col will be within those boundaries when you set them. The argument variable x is also unused and can be removed.
Here's the fixed code:
Code:
function addmines () {
var n = 10; //number of mines
while (n>0) {
var row = Math.floor(Math.random()*9);
var col = Math.floor(Math.random()*9);
var id = "r" + row + "c" + col;
var td = document.getElementById(id);
if (td.children.length > 0)
continue; //there's already a mine here
n--;
var a = document.createElement("img");
a.src = "mine32.gif";
a.height = 30;
a.width = 30;
td.appendChild(a);
}
}
Code:
//Creates Tabledocument.write('<table>');
//for loop that creates the row, increments
//from 0 to 9 each time it reiterates
for (var row=0; row<9; row++) {
document.write('<tr>');
//a nested for loop that reiterates 9 times creating
//the <td>'s and then exits to the parent for loop.
for (var col=0; col<9; col++) {
document.write('<td id="r', row, 'c', col, '">');
document.write('</td>');
}
document.write('</tr>');
}
document.write('</table>');
addmines();
Bookmarks