Copie el código de código de la siguiente manera:
<!tipo de documento html>
<html>
<cabeza>
<title>lienzo dClock</title>
</cabeza>
<cuerpo>
<canvas id = "reloj" ancho = "500px" alto = "200px">
Tu navegador es demasiado antiguo, ¡actualízalo!
</lienzo>
<tipo de secuencia de comandos = "texto/javascript">
var reloj = document.getElementById("reloj");
var cxt = reloj.getContext("2d");
//muestra el reloj digital
función mostrarHora(m, n) {
cxt.clearRect(0, 0, 500, 500);
var ahora = nueva fecha;
var hora = ahora.getHours();
var min = ahora.getMinutes();
var seg = ahora.getSeconds();
var msec = ahora.getMillisegundos();
hora = hora >= 10 ? hora : "0" + hora;
min = min >= 10 min : "0" + min;
segundo = segundo >= 10 segundo : "0" + segundo;
mseg = (mseg >= 10 && mseg < 100)? ("0" + mseg): (mseg >= 0 && mseg < 10)? ("00" + mseg): mseg;
bdigital(m, n, hora);
bdigital(m + 160, n, mín);
bdigital(m + 320, n, seg);
//tdigital(m + 480, n, mseg);
//Pantalla de tres dígitos
función tdigital(x, y, número) {
var ge = núm % 10;
var shi = (parseInt(num/10)) % 10;
var bai = parseInt((parseInt(num / 10)) / 10) % 10;
digital(x, y, bai);
digital(x + 70, y, shi);
digital(x + 140, y, ge);
}
//Pantalla de dos dígitos
función bdigital(x, y, núm) {
var ge = núm % 10;
var shi = (parseInt(num/10)) % 10;
digital(x, y, shi);
digital(x + 70, y, ge);
}
//cuadro:
//entre horas y minutos
cxt.lineWidth = 5;
cxt.strokeStyle = "#000";
cxt.fillStyle = "#000";
cxt.beginPath();
cxt.arc(m + 140, n + 80, 3, 0, 360, falso);
cxt.fill();
cxt.closePath();
cxt.stroke();
cxt.lineWidth = 5;
cxt.strokeStyle = "#000";
cxt.fillStyle = "#000";
cxt.beginPath();
cxt.arc(m + 140, n + 100, 3, 0, 360, falso);
cxt.fill();
cxt.closePath();
cxt.stroke();
//entre minutos y segundos
cxt.lineWidth = 5;
cxt.strokeStyle = "#000";
cxt.fillStyle = "#000";
cxt.beginPath();
cxt.arc(m + 300, n + 80, 3, 0, 360, falso);
cxt.fill();
cxt.closePath();
cxt.stroke();
cxt.lineWidth = 5;
cxt.strokeStyle = "#000";
cxt.fillStyle = "#000";
cxt.beginPath();
cxt.arc(m + 300, n + 100, 3, 0, 360, falso);
cxt.fill();
cxt.closePath();
cxt.stroke();
//Uno entre segundos y milisegundos.
// cxt.lineWidth = 5;
// cxt.strokeStyle = "#000";
// cxt.fillStyle = "#000";
// cxt.beginPath();
// cxt.arc(m + 460, n + 100, 3, 0, 360, falso);
// cxt.fill();
// cxt.closePath();
// cxt.stroke();
}
//muestra un dígito
función digital(x, y, número) {
//Establecer estilo
cxt.lineWidth = 5;
cxt.strokeStyle = "#000";
//a
función a() {
cxt.beginPath();
cxt.moveTo(x, y);
cxt.lineTo(x + 50, y);
cxt.closePath();
cxt.stroke();
}
//b
función b() {
cxt.beginPath();
cxt.moveTo(x + 55, y + 5);
cxt.lineTo(x + 55, y + 55);
cxt.closePath();
cxt.stroke();
}
//do
función c() {
cxt.beginPath();
cxt.moveTo(x + 55, y + 60);
cxt.lineTo(x + 55, y + 110);
cxt.closePath();
cxt.stroke();
}
//d
función d() {
cxt.beginPath();
cxt.moveTo(x + 50, y + 115);
cxt.lineTo(x, y + 115);
cxt.closePath();
cxt.stroke();
}
//mi
función mi() {
cxt.beginPath();
cxt.moveTo(x - 5, y + 110);
cxt.lineTo(x - 5, y + 60);
cxt.closePath();
cxt.stroke();
}
//F
función f() {
cxt.beginPath();
cxt.moveTo(x - 5, y + 55);
cxt.lineTo(x - 5, y + 5);
cxt.closePath();
cxt.stroke();
}
//gramo
función g() {
cxt.beginPath();
cxt.moveTo(x, y + 57,5);
cxt.lineTo(x + 50, y + 57,5);
cxt.closePath();
cxt.stroke();
}
//0
función cero() {
a(); b(); c();
}
//1
función uno() {
b(); c();
}
//2
función dos() {
a(); b(); d();
}
//3
función tres() {
a(); b(); c();
}
//4
función cuatro() {
b(); c();
}
//5
función cinco() {
a(); c(); d();
}
//6
función seis() {
a(); c(); d();
}
//7
función siete() {
a(); b();c();
}
//8
función ocho() {
a(); b();
}
//9
función nueve() {
a(); b(); c();
}
//Número n
número de función (n) {
cambiar (n) {
caso 0: cero(); descanso;
caso 1: uno(); descanso;
caso 2: dos(); descanso;
caso 3: tres(); descanso;
caso 4: cuatro(); descanso;
caso 5: cinco(); descanso;
caso 6: seis(); descanso;
caso 7: siete(); descanso;
caso 8: ocho(); descanso;
caso 9: nueve(); descanso;
}
}
número(núm);
}
mostrarHora(1, 45);
setInterval("mostrarHora(1,45)", 1000);
</script>
</cuerpo>
</html>