embers02
New Coder
It says Uncaught TypeError: Cannot set properties of null (setting 'innerHTML')
How do i fix this?
How do i fix this?
HTML:
<HTML>
<head>
<title>Idle Miner</title>
<style>
.sectionLeft {
float: left;
width: 80%;
}
.sectionRight {
float: right;
width: 20%
}
.scoreContainer {
background-color: rgb(238, 238, 238);
width: 50%;
padding: 10px;
border-radius: 50px;
font-size: 24px;
font-weight: bold;
}
.clickerContainer img {
position: relative;
transition: all .2s ease-in-out;
}
.clickerContainer img:hover { transform: scale(1.10); }
.clickerContainer img:active { transform: scale(0.99); }
.shopButton {
background-color: b5b5b5;
transition: all .2s ease-in-out;
border-radius: 10ps;
width: 100%;
}
.shopButton:hover {
background-color: c7c7c7;
transition: all .2s ease-in-out;
}
.shopButton #image {
width: 25%;
}
.shopButton img {
height: 64px;
width: 64px;
}
.shopButton #nameAndCost p {
margin: 0px;
width: 60%;
}
.shopButton #nameAndCost p:first-of-type {
font-size: 24px;
}
.shopButton #amount {
font
</style>
</head>
<body>
<div class="sectionLeft">
<center>
<div class="scoreContainer">
<span id="score">0</span> money<br>
<span id="scorepersecond">0</span> money per second
</div>
<br>
<div class="clickerContainer">
<img src="images/rock.png" height="256px" width="256px" onclick="addToScore(clickingPower)">
</div>
</center>
</div>
<div class="sectionRight">
<table class="shopButton" onclick="buyCoals()">
<tr>
<td id="image"><img src="images/Coal.png"></td>
<td id="nameAndCost">
<p>Coal</p>
<p><span id="coalcost">32</span> money</p>
</td>
<td id="amount"><span id="coal">0</span></td>
</tr>
</table>
</div>
<script>
var score = 0;
var clickingPower = 2;
var coalCost = 32;
var coals = 0;
var ironCost = 128;
var irons = 0;
function buyCoals() {
if (score >= coalCost) {
score = score - coalCost;
coals = coals + 1;
coalCost = Math.round(coalCost * 1.15);
document.getElementById("score").innerHTML = score;
document.getElementById("coalcost").innerHTML = coalCost;
document.getElementById("coals").innerHTML = coals;
updateScorePerSecond();
}
}
function buyIron() {
if (score >= ironCost) {
score = score - ironCost;
irons = irons + 1;
Cost = Math.round(ironCost * 1.15);
document.getElementById("score").innerHTML = score;
document.getElementById("ironcost").innerHTML = ironCost;
document.getElementById("irons").innerHTML = irons;
updateScorePerSecond();
}
}
function addToScore(amount) {
score = score + amount;
document.getElementById("score").innerHTML = score;
}
function updateScorePerSecond() {
scorePerSecond = coals + irons * 5;
document.getElementById("scorepersecond").innerHTML = scorePerSecond;
}
setInterval(function() {
score = score + coals;
score = score + irons * 5 ;
document.getElementById("score").innerHTML = score;
document.title = score + " money - Idle Miner"
}, 1000) ; // 1000ms = 1 second
</script>
</head>
</HTML>
Last edited by a moderator: