Estoy intentando colocar un reloj con Javascript y obtengo el error:
Uncaught RangeError: Maximum call stack size exceeded
Se marca en la línea en que se declara la función: function setClock(element_id)
Este es el código simplificado:
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Test</title><style> * { text-align: center; } .content { margin: 3% 9%; } .time-box span { display: inline-block; }</style></head><body><div class="content"><div class="time-box"><span>Hora: <span id="actual-time"></span></span></div></div><script> function setClock(element_id) { const date = new Date(); const hours = date.getHours(); const minutes = date.getMinutes(); const seconds = date.getSeconds(); const now = hours +':'+ minutes +':'+ seconds; document.getElementById(element_id).innerText = now; setTimeout(setClock(element_id), 1000); } setClock('actual-time');</script></body></html>
Editado
Otra prueba (sin errores) pero que no actualiza el tiempo:
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Test</title><style> * { text-align: center; } .content { margin: 3% 9%; } .time-box span { display: inline-block; }</style></head><body><div class="content"><div class="time-box"><span>Hora: <span id="actual-time"></span></span></div></div><script> function setClock(element_id) { const date = new Date(); const hours = date.getHours(); const minutes = date.getMinutes(); const seconds = date.getSeconds(); const now = hours +':'+ minutes +':'+ seconds; document.getElementById(element_id).innerText = now; } window.onload = function () { setInterval(setClock('actual-time'), 1000); }</script></body></html>
Este último caso no funciona si le indico la id del elemento el la llamada a la función.