I don't know why the 'test' paragraph doesn't change when it reaches 0. What do I do wrong? I tried to put 'damage', 'heal' inside the 'if-statement', but it didn't work. The condition is pretty simple so I have no idea what went wrong.
And also, how can I stop the functions when the health is less than 0 or more than 100?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>SMTH</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="styles/styles.css" />
</head>
<body>
<div class="main">
<p id="health">Enemy's health: </p>
<dl>
<dd id="plus">+100</dd>
<dd id="minus">-100</dd>
</dl>
<p id="test"></p>
</div>
<script src="script/app.js"></script>
</body>
</html>
let healthS = document.getElementById('health');
let plus = document.getElementById('plus');
let minus = document.getElementById('minus');
health = 100;
let damage = ()=>{
health -= Math.floor(Math.random() * 15);
healthS.innerHTML = "Enemy's health: " + health;
}
let heal = ()=>{
health += Math.floor(Math.random() * 10);
healthS.innerHTML = "Enemy's health: " + health;
}
minus.onclick = damage;
plus.onclick = heal;
if(health > 80){
test.innerHTML = "Alive";
}else if(health <= 0){
test.innerHTML = "Dead";
}
Aucun commentaire:
Enregistrer un commentaire