Hola Ogramar.
Me pasa exactamente lo que dices.
Lo solucioné sacando la linea
setInterval(function(){reloj()},1000);
fuera de la función reloj.
quedando así el código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">
<script type="text/javascript">
function empezar(){
setInterval(function(){reloj()},1000);
}
function reloj() {
var hoy=new Date(); var h=hoy.getHours(); var m=hoy.getMinutes(); var s=hoy.getSeconds();
m = actualizarHora(m); s = actualizarHora(s);
document.getElementById('displayReloj').innerHTML = h+":"+m+":"+s;
}
function actualizarHora(i) {
if (i<10) {i = "0" + i}; // Añadir el cero en números menores de 10
return i;
}
</script>
</head>
<body onload="empezar()" >
<div style="text-align:center;">
<div id="cabecera"><h2>Cursos aprenderaprogramar.com</h2><h3>Reloj JavaScript</h3></div>
<div style="color:blue; font-family: verdana, arial; font-size:30px; padding:15px;" id ="displayReloj" > </div>
</div>
</body>
</html>
Pero en realidad no entiendo el porqué de esta forma sí funciona y de la otra no.
Edito...
Después de pensarlo, creo que sí lo entiendo.
Si setInterval esta dentro de la función, lo que hace el código es que va sumando ejecuciones de la función. Es decir, si digo que se ejecute la función reloj con un intervalo de 1 segundo, cada vez que entre en la función reloj, le estoy volviendo a decir lo mismo, con lo cual la segunda vez que entramos en la función reloj y se ejecuta la linea del setInterval, cuando se ejecuta la función reloj, se ejecutará dos veces, y así sucesivamente, llegando un momento que llegamos al bloqueo de la página.