ejercicio4
This commit is contained in:
@@ -1 +1,34 @@
|
||||
// Agregar aquí el código javascript
|
||||
|
||||
// Crear una página con tres elementos: un botón "Sumar", un botón "Restar" y un
|
||||
// párrafo que muestre el valor actual del contador, empezando en `0`.
|
||||
|
||||
// Requisitos:
|
||||
// - El contador no puede bajar de `0` ni subir de `10`.
|
||||
// - Cuando el contador llega a `10`, el botón "Sumar" se deshabilita.
|
||||
// - Cuando el contador llega a `0`, el botón "Restar" se deshabilita.
|
||||
// - Al volver a un valor intermedio, los botones se vuelven a habilitar.
|
||||
|
||||
let botonSumar = document.querySelector("#botonSumar");
|
||||
let botonRestar = document.querySelector("#botonRestar");
|
||||
let numero = document.querySelector("#numero");
|
||||
|
||||
botonSumar.addEventListener("click", (e)=>{
|
||||
if(numero.textContent < 9){ // siempre que numero < 9 queremos que se ejecute el codigo (supongamos numero = 8)
|
||||
++numero.textContent; // numero = 9
|
||||
botonRestar.disabled = false; //habilitamos el restar en caso de que no esté habilitado
|
||||
} else if (numero.textContent == 9) { // solamente en caso de numero = 9 se ejecuta este else if
|
||||
++numero.textContent; // numero = 10
|
||||
botonSumar.disabled = true; // ya no queremos seguir sumando, ergo, desactivamos el boton sumar
|
||||
}
|
||||
})
|
||||
|
||||
botonRestar.addEventListener("click", (e)=>{
|
||||
if(numero.textContent > 1){ // supongamos que en esta instancia numero = 2
|
||||
--numero.textContent; // // ahora numero = 1
|
||||
botonSumar.disabled = false // (esta linea la ejecutamos por las dudas para asegurarnos de que se vuelva a habilitar al boton sumar en caso de estar desabilitado, pero solo seria necesaria si numero = 10)
|
||||
} else if (numero.textContent == 1) {
|
||||
--numero.textContent; // ahora numero = 0
|
||||
botonRestar.disabled = true; // por lo tanto desabilitamos el boton
|
||||
}
|
||||
})
|
||||
|
||||
@@ -8,7 +8,9 @@
|
||||
</head>
|
||||
<body>
|
||||
<h1>Ejercicio 4</h1>
|
||||
|
||||
<button id="botonRestar" disabled="true">Restar (-)</button> <!-- desabilitamos el botonRestar de entrada, ya que empezamos en 0 -->
|
||||
<button id="botonSumar">Sumar (+)</button>
|
||||
<p>contador: <span id="numero">0</span></p>
|
||||
<script src="ejercicio4.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user