Hacer un reloj en vivo en formato 00:00
¿Cómo se puede hacer un reloj en vivo en formato de 00:00 ? He incluido mi código a continuación. ¿Hay alguna forma de hacer esto mejor o con un código más corto?
HTML
<body onload=display_ct();>
<span id='ct'></span>
Ahora solo necesitamos agregar la parte javascript. Esto actualiza el reloj cada segundo para que esté " En vivo ". También utiliza funciones como getMinutesbuscar la hora actual.
Javascript
function display_c(){
var refresh=1000; // Refresh rate in milli seconds
mytime=setTimeout('display_ct()',refresh)
}
function display_ct() {
var x = new Date()
x1 = x.getHours( )+ ":" + x.getMinutes();
document.getElementById('ct').innerHTML = x1;
display_c();
}
Los 1000 milisegundos se pueden intercambiar con más o menos. 1000 es igual a 1 segundo, por lo que significaría que 500 ms serían 0,5 segundos.
Incluiré mi código en un ejecutable aquí:
function display_c(){
var refresh=1000; // Refresh rate in milli seconds
mytime=setTimeout('display_ct()',refresh)
}
function display_ct() {
var x = new Date()
x1 = x.getHours( )+ ":" + x.getMinutes();
document.getElementById('ct').innerHTML = x1;
display_c();
}<body onload=display_ct();>
<span id='ct'></span>Respuestas
Necesita usar en setIntervallugar de setTimeout. Además, puede usar la padStart()función para agregar ceros a la izquierda a sus stringvalores.
Ps: Debido a que solo muestra horas y minutos, el reloj se actualizará cada minuto, en lugar de cada segundo (la función aún se ejecuta cada segundo)
function display_c() {
var refresh = 1000; // Refresh rate in milli seconds
mytime = setInterval(display_ct, refresh)
}
function display_ct() {
var x = new Date()
x1 = x.getHours().toString().padStart(2,0) + ":" + x.getMinutes().toString().padStart(2,0);
document.getElementById('ct').innerHTML = x1;
display_c();
}<body onload=display_ct();>
<span id='ct'></span>hacer un js dentro o fuera de su página principal como este
Debe tener un elemento con MyClockDisplay como id para este código
function showTime() {
var date = new Date();
var h = date.getHours(); // 0 - 23
var m = date.getMinutes(); // 0 - 59
var s = date.getSeconds(); // 0 - 59
var session = "AM";
if (h == 0) {
h = 12;
}
if (h > 12) {
h = h - 12;
session = "PM";
}
h = h < 10 ? "0" + h : h;
m = m < 10 ? "0" + m : m;
s = s < 10 ? "0" + s : s;
var time = h + ":" + m + ":" + s + " " + session;
document.getElementById("MyClockDisplay").innerText = time;
document.getElementById("MyClockDisplay").textContent = time;
setTimeout(showTime, 1000);
}
showTime();<div id="MyClockDisplay"></div>