0
I am building a digital clock with html, css and javascript, please help, the minutes and seconds are not working please help me
const hourE1 = document.getElementById("hour") const minutesE1 = document.getElementById("minutes") const secondsE1 = document.getElementById("seconds") const ampmE1 = document.getElementById("ampm") function updateClock(){ let h = new Date().getHours() let m = new Date().getMinutes() let s = new Date().getSeconds() let ampm = "AM"; if(h > 12){ h = h- 12 ampm = "PM"; } hourE1.innerText = h; minutesE1.innerText = m; secondsE1.innerText =s; ampmE1, (innerText = ampm); setTimeout(()=>{ updateClock() }, 1000); } updateClock()
4 odpowiedzi
+ 4
Code look fine to me, except this part:
ampmE1, (innerText = ampm);
Did you mean:
ampmE1.innerText = ampm;
If you still have problem (it is probably error "element is not defined" - something like this), it is because you typed this code inside js tab here on sololearn.
If you type code inside js tab it is same as js code inside head, it will load before html elements and you will get error, that element is not defined.
Solution for this is to wrap your code inside:
window.onload = () => {
// your js code where you access DOM
}
+ 1
Check this code, you can see how i wrapped js code inside window.onload function.
If syntax is unfamiliar you may read also about arrow functions:
https://www.w3schools.com/js/js_arrow_function.asp
And window.onload method:
https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event
https://code.sololearn.com/WqB5NJjP25Mp/?ref=app
0
Thank you for the reply, i am really new to this, please explain where i will substitute this code into
window.onload = () => {
// your js code where you access DOM
}
0
const TimeDisplay = document.getElementById("TimeDisplay");
window.onload = () => {
updateClock();
}
function updateClock(){
let d = new Date();
TimeDisplay.innerText = d.toLocaleTimeString();
setTimeout(()=>{ updateClock() }, 1000);
}
https://www.sololearn.com/compiler-playground/WGEy6xO69Y1J