\ Uncaught TypeError: Cannot set properties of null (setting 'textContent')

JavaScript
1

I am making some timers for my trees in my game the first timer works fine then the second and third throw out errors script.js:1986 Uncaught TypeError: Cannot set properties of null (setting 'textContent') Why? For a demo go here then click on woodcutting and pop open the console and wait patiently for the tree to start growing Gem Hunt


function normalTreeTimer(duration, display, timePatchName) {
	var timer = duration, minutes, seconds,hours
  
    setInterval(function () {
	   seconds = parseInt(timer % 60, 10)
	   if (seconds >= 60) { 
		 seconds = 0
	   }
	   minutes = parseInt(timer / 60, 10)
	   if (minutes >= 60) minutes = minutes % 60
	   hours = parseInt(timer/3600,10)
	   display.textContent = hours + ":" + minutes + ":" + seconds
	   if (timer-- <= 0) {
		 document.getElementById(timePatchName).innerHTML = "READY"
	   }
   }, 1000)
}

let normalTreeChopped = 0
let patch1 = document.getElementById("patch-image-1")
let patch1Src = patch1.getAttribute('src')

let patch2 = document.getElementById("patch-image-2")
let patch2Src = patch2.getAttribute('src')

let patch3 = document.getElementById("patch-image-3")
let patch3Src = patch3.getAttribute('src')

let nonePath = 'assets/img/woodcutting/trees/none.png'
function startTreeGrow() {
	if (woodLevel >= 1) {
		let normalTreeChance = Math.floor(Math.random() * 6)
		if (normalTreeChance == 3) {
			if (patch1Src == nonePath) {
				document.getElementById("treeName1").innerHTML = "Tree"
				patch1Src = 'assets/img/woodcutting/trees/tree/tree1.png'
				patch1.src = 'assets/img/woodcutting/trees/tree/tree1.png'
				  
				function startTimerNormalTree1() {
					var timeToGrowNormalTree = 7200 /*amount of seconds*/, display = document.getElementById('timeleft1tree')
					normalTreeTimer(timeToGrowNormalTree, display, "timeleft1tree")
				}

				startTimerNormalTree1()
			} else if (patch2Src == nonePath) {
				document.getElementById("treeName2").innerHTML = "Tree"
				patch2Src = 'assets/img/woodcutting/trees/tree/tree1.png'
				patch2.src = 'assets/img/woodcutting/trees/tree/tree1.png'

				function startTimerNormalTree2() {
					var timeToGrowNormalTree2 = 7200 /*amount of seconds*/, display = document.getElementById('timeleft2tree')
					normalTreeTimer(timeToGrowNormalTree2	, display, "timeleft1tree")
				}
				
				startTimerNormalTree2()
			} else if (patch3Src = nonePath) {
				document.getElementById("treeName3").innerHTML = "Tree"
				patch3Src = 'assets/img/woodcutting/trees/tree/tree1.png'
				patch3.src = 'assets/img/woodcutting/trees/tree/tree1.png'
				
				function startTimerNormalTree3() {
					var timeToGrowNormalTree3 = 7200 /*amount of seconds*/, display = document.getElementById('timeleft3tree')
					normalTreeTimer(timeToGrowNormalTree3, display, "timeleft1tree")
				}
				
				
				startTimerNormalTree3()
			} else {
				console.log("NOPE!")
			}
		}
	}
}

setInterval(startTreeGrow, 1000)
3

yup I see it when making duplicate patches I frogot to change around the numbers in html

5

how do I do that? Are there any good tutorials? Because I know how to make separate files and import them but how do I make them connected so all the variables are in the other files?

7

Well I am trying it out I am trying git with a variable first and I did this in ad separate file called script_vars.js and in my HTML I did <script src="script_vars.js" type="module"></script> and then in my script_vars.js I did

export{ coin }
let coin = document.getElementById("coin-count").innerHTML

bu when I did this in my script.js file import * as vars from "./script_vars.js" it said

Uncaught SyntaxError: Cannot use import statement outside a module (at script.js:1:1)

9

I only did the timg with the coins I do the other stuff in javscript and only display yhte values

10

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.