for some reason with this I get the error: Cannot set property 'textcontent' of null for this line:
document.getElementById("days").textContent = d;
function countdown() {
var now = new Date();
var eventDate = new Date(2018, 1, 19);
var currentTime = now.getTime();
var eventTime = eventDate.getTime();
var remTime = eventTime - currentTime;
var s = Math.floor(remTime / 1000);
var m = Math.floor(s / 60);
var h = Math.floor(m / 60);
var d = Math.floor(h / 24);
h %= 24;
m %= 60;
s %= 60;
h = (h < 10) ? "0" + h : h;
m = (m < 10) ? "0" + m : m;
s = (s < 10) ? "0" + s : s;
document.getElementById("days").textContent = d;
document.getElementById("days").innerText = d;
document.getElementById("hours").textContent = h;
document.getElementbyId("minutes").textContent = m;
document.getElementById("seconds").textContent = s;
}
countdown();<li>
<span class="value">Ends in:
</span>
<p id="days">30</p>
<p id="hours">10</p>
<p id="minutes">5</p>
<p id="seconds">1</p>
</li>for some reason with this I get the error: Cannot set property 'textcontent' of null for this line:
document.getElementById("days").textContent = d;
function countdown() {
var now = new Date();
var eventDate = new Date(2018, 1, 19);
var currentTime = now.getTime();
var eventTime = eventDate.getTime();
var remTime = eventTime - currentTime;
var s = Math.floor(remTime / 1000);
var m = Math.floor(s / 60);
var h = Math.floor(m / 60);
var d = Math.floor(h / 24);
h %= 24;
m %= 60;
s %= 60;
h = (h < 10) ? "0" + h : h;
m = (m < 10) ? "0" + m : m;
s = (s < 10) ? "0" + s : s;
document.getElementById("days").textContent = d;
document.getElementById("days").innerText = d;
document.getElementById("hours").textContent = h;
document.getElementbyId("minutes").textContent = m;
document.getElementById("seconds").textContent = s;
}
countdown();<li>
<span class="value">Ends in:
</span>
<p id="days">30</p>
<p id="hours">10</p>
<p id="minutes">5</p>
<p id="seconds">1</p>
</li>-
3
Are you sure it is that line?
document.getElementbyId("minutes")you have an error where thebshould be uppercase. – Get Off My Lawn Commented Dec 22, 2017 at 18:39 - 1 It looks like countdown() function runs before html snippet you've posted has been actually loaded and as a consequence,element with id "days" could not be found and getElementById returns null, which, obviously, does not contain property, specified in the error message. – fatherOfWine Commented Dec 22, 2017 at 18:47
4 Answers
Reset to default 1The issue may be that the element may not exist at the time your "countdown" runs... Could you try calling countdown onload of the body / div that contains the set of elements you're querying?
<body onload="countdown()">
The only issue that I see is that your b needs to be uppercase on this line:
document.getElementbyId("minutes").textContent = m;
When fixing that the code works as expected:
function countdown() {
var now = new Date();
var eventDate = new Date(2018, 1, 19);
var currentTime = now.getTime();
var eventTime = eventDate.getTime();
var remTime = eventTime - currentTime;
var s = Math.floor(remTime / 1000);
var m = Math.floor(s / 60);
var h = Math.floor(m / 60);
var d = Math.floor(h / 24);
h %= 24;
m %= 60;
s %= 60;
h = (h < 10) ? "0" + h : h;
m = (m < 10) ? "0" + m : m;
s = (s < 10) ? "0" + s : s;
document.getElementById("days").textContent = d;
document.getElementById("days").innerText = d;
document.getElementById("hours").textContent = h;
document.getElementById("minutes").textContent = m;
document.getElementById("seconds").textContent = s;
}
countdown();<li>
<span class="value">Ends in:
</span>
<p id="days">30</p>
<p id="hours">10</p>
<p id="minutes">5</p>
<p id="seconds">1</p>
</li>Make sure that your code is ran after the dom has finished loading.
you can do so like this:
document.addEventListener('DOMContentLoaded', () => countdown());
You have an error: getElementById instead of getElementbyId.
The new code will be:
function countdown() {
var now = new Date();
var eventDate = new Date(2018, 1, 19);
var currentTime = now.getTime();
var eventTime = eventDate.getTime();
var remTime = eventTime - currentTime;
var s = Math.floor(remTime / 1000);
var m = Math.floor(s / 60);
var h = Math.floor(m / 60);
var d = Math.floor(h / 24);
h %= 24;
m %= 60;
s %= 60;
h = (h < 10) ? "0" + h : h;
m = (m < 10) ? "0" + m : m;
s = (s < 10) ? "0" + s : s;
document.getElementById("days").textContent = d;
document.getElementById("days").innerText = d;
document.getElementById("hours").textContent = h;
document.getElementById("minutes").textContent = m;
document.getElementById("seconds").textContent = s;
}
countdown();<li>
<span class="value">Ends in:
</span>
<p id="days">30</p>
<p id="hours">10</p>
<p id="minutes">5</p>
<p id="seconds">1</p>
</li>Simply add defer in your HTML where you have inserted script tag.
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1744994411a4605101.html
评论列表（0条）