WEBLEB
Inicio
Editora de código
Iniciar sesión
Pro
Español
English
Français
Español
Português
Deutsch
Italiano
हिंदी
HTML
CSS
JS
Juego de Adivinar el Número
Juego de Adivinar el Número
Adivina el número entre 1 y 10.
Enviar
Jugar de nuevo
body { font-family: Arial, sans-serif; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; background-color: #f0f0f0; } .container { text-align: center; background: #fff; padding: 20px; border-radius: 8px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } input[type="number"] { width: 60px; padding: 5px; font-size: 16px; } button { padding: 10px 20px; font-size: 16px; border: none; border-radius: 5px; cursor: pointer; margin-top: 10px; } button:hover { background-color: #007BFF; color: #fff; } #message { margin-top: 15px; font-weight: bold; }
document.addEventListener('DOMContentLoaded', () => { const guessInput = document.getElementById('guess'); const submitButton = document.getElementById('submit'); const messageElement = document.getElementById('message'); const restartButton = document.getElementById('restart'); let secretNumber; function startGame() { secretNumber = Math.floor(Math.random() * 10) + 1; messageElement.textContent = ''; guessInput.value = ''; guessInput.disabled = false; submitButton.disabled = false; restartButton.style.display = 'none'; } function checkGuess() { const userGuess = parseInt(guessInput.value, 10); if (isNaN(userGuess) || userGuess < 1 || userGuess > 10) { messageElement.textContent = 'Por favor, ingresa un número válido entre 1 y 10.'; return; } if (userGuess === secretNumber) { messageElement.textContent = '¡Correcto! ¡Has adivinado el número!'; guessInput.disabled = true; submitButton.disabled = true; restartButton.style.display = 'inline'; } else { messageElement.textContent = 'Incorrecto, inténtalo de nuevo.'; } } submitButton.addEventListener('click', checkGuess); restartButton.addEventListener('click', startGame); startGame(); // Inicia el juego al cargar la página });
Validating your code, please wait...
HTML
CSS
JS
Juego de Adivinar el Número
Juego de Adivinar el Número
Adivina el número entre 1 y 10.
Enviar
Jugar de nuevo
body { font-family: Arial, sans-serif; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; background-color: #f0f0f0; } .container { text-align: center; background: #fff; padding: 20px; border-radius: 8px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } input[type="number"] { width: 60px; padding: 5px; font-size: 16px; } button { padding: 10px 20px; font-size: 16px; border: none; border-radius: 5px; cursor: pointer; margin-top: 10px; } button:hover { background-color: #007BFF; color: #fff; } #message { margin-top: 15px; font-weight: bold; }
document.addEventListener('DOMContentLoaded', () => { const guessInput = document.getElementById('guess'); const submitButton = document.getElementById('submit'); const messageElement = document.getElementById('message'); const restartButton = document.getElementById('restart'); let secretNumber; function startGame() { secretNumber = Math.floor(Math.random() * 10) + 1; messageElement.textContent = ''; guessInput.value = ''; guessInput.disabled = false; submitButton.disabled = false; restartButton.style.display = 'none'; } function checkGuess() { const userGuess = parseInt(guessInput.value, 10); if (isNaN(userGuess) || userGuess < 1 || userGuess > 10) { messageElement.textContent = 'Por favor, ingresa un número válido entre 1 y 10.'; return; } if (userGuess === secretNumber) { messageElement.textContent = '¡Correcto! ¡Has adivinado el número!'; guessInput.disabled = true; submitButton.disabled = true; restartButton.style.display = 'inline'; } else { messageElement.textContent = 'Incorrecto, inténtalo de nuevo.'; } } submitButton.addEventListener('click', checkGuess); restartButton.addEventListener('click', startGame); startGame(); // Inicia el juego al cargar la página });