Hello, i need to make a RPG stat generator in javascript. I have the code but i
ID: 671538 • Letter: H
Question
Hello, i need to make a RPG stat generator in javascript. I have the code but i need to be able to do it with out using function. Im sure its simple to most but i cant figure out how to make it work with out it. Any help would be great
T
HTML FILE:
<h1 id="title">Dice Example</h1>
<table>
<tr>
<th>Strength</th>
<th>Dexterity</th>
<th>Intelligence</th>
<th>Wisdom</th>
<th>Constitution</th>
<th>Charishma</th>
</tr>
<tr>
<td id="id0"></td>
<td id="id1"></td>
<td id="id2"></td>
<td id="id3"></td>
<td id="id4"></td>
<td id="id5"></td>
</tr>
</table>
<br>
<input type="submit" id="byBtn" value="Fill Table"/>
JS FILE:
function fillTable(){
for(var i=0;i<6;i++){ //loop to fill six cells in tables
for(var j=0;j<3;j++){ //loop to 3 dices
//get random values
var firstDie = Math.floor(Math.random() * 6) + 1 ;
var secondDie = Math.floor(Math.random() * 6) + 1 ;
var thirdDie = Math.floor(Math.random() * 6) + 1 ;
var td = document.getElementById('id'+i);
td.innerHTML = firstDie+secondDie+thirdDie; //printing value to table
}
}
}
CSS FILE:
table, td, th {
border: 1px solid green;
}
th {
background-color: green;
color: white;
}
Thanks for your time.
Explanation / Answer
Hi as mentioned above with out using the function (onclick) you want to run the java script,for this you can use below html code
<html>
<head>
<title>
RPG Stat Generator
</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="rpg.js" ></script>
</head>
<body>
<h1 id="title">Dice Example</h1>
<table>
<tr>
<th>Strength</th>
<th>Dexterity</th>
<th>Intelligence</th>
<th>Wisdom</th>
<th>Constitution</th>
<th>Charishma</th>
</tr>
<tr>
<td id="id0"></td>
<td id="id1"></td>
<td id="id2"></td>
<td id="id3"></td>
<td id="id4"></td>
<td id="id5"></td>
</tr>
</table>
<br>
</body>
</html>
rpg.js
JS FILE:
function fillTable(){
for(var i=0;i<6;i++){ //loop to fill six cells in tables
for(var j=0;j<3;j++){ //loop to 3 dices
//get random values
var firstDie = Math.floor(Math.random() * 6) + 1 ;
var secondDie = Math.floor(Math.random() * 6) + 1 ;
var thirdDie = Math.floor(Math.random() * 6) + 1 ;
var td = document.getElementById('id'+i);
td.innerHTML = firstDie+secondDie+thirdDie; //printing value to table
}
}
}
style.css
table, td, th {
border: 1px solid green;
}
th {
background-color: green;
color: white;
}
Related Questions
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.