Este artículo describe el efecto de reloj digital de la cuenta regresiva de la página web implementado por JS. Compártelo para su referencia. El método de implementación específico es el siguiente:
Copie el código de la siguiente manera: <! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1 transitional.dtd"> ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Reloj Countdown Implementado por JavaScript </title>
<estilo>
cuerpo, div {margen: 0; relleno: 0;}
cuerpo {color: #ffff; fuente: 16px/1.5/5fae/8f6f/96c5/9ed1;}
#CountDown {ancho: 300px; text-align: centro; fondo:#1a1a1a; margen: 10px auto; relleno: 20px 0;}
entrada {border: 0; ancho: 283px; altura: 50px; cursor: pointer; margin-top: 20px; fondo: url (// www.vevb.com/jscss/demoimg/201210/btn-1.png) no-repeat;}
input.cancel {Posición de fondo: 0 -50px;}
span {color:#000; ancho: 80px; línea de línea: 2; fondo: #fbfbfb; borde: 2px sólido#b4b4b4; margen: 0 10px; relleno: 0 10px;}
</style>
<script>
Window.Onload = function ()
{
var oCountdown = document.getElementById ("Countdown");
var aInput = oCountDown.getElementsBytagName ("Entrada") [0];
VAR TIMER = NULL;
ainput.Onclick = function ()
{
this.classname == ""? (Timer = SetInterval (UpdateTime, 1000), UpdateTime ()): (ClearInterval (Timer));
this.classname = this.classname == ''? "Cancelar" : '';
};
Formato de función (a)
{
devolver A.ToString (). Reemplazar (/^(/d) $/, '0 $ 1')
}
función updateTime ()
{
var aspan = oCountdown.getElementsBytagName ("Span");
var oremain = aspan [0] .innerhtml.replace (/^0/, '') * 60 + parseint (Aspan [1] .innerhtml.replace (/^0/, ''));
if (oremain <= 0)
{
ClearInterval (temporizador);
Devolver
}
OREMAIN--;
aspan [0] .innerhtml = formato (parseInt (oremain / 60));
OREMAIN %= 60;
aspan [1] .innerhtml = format (parseInt (oremain));
}
}
</script>
</ablo>
<Body>
<div id = "Countdown">
<span> 01 </span> min <span> 40 </span> segundos
<input type = "button" value = "" />
</div> wulin.com www.vevb.com Efectos especiales del código
</body>
</html>
Espero que este artículo sea útil para la programación de JavaScript de todos.