<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>
<body>
<div class="container ">
<h2>Tirada de dados</h2>
<button type="button" onclick="tirar()" class="btn btn-primary">Tira el dado</button>
<h1 id="dado"></h1>
<h2 id="mensaje"></h2>
<h2 id="repetido"></h2>
<script src="js/test.js"></script>
</form>
</div>
</body>
</html>
// En esta variable guardamos la tirada anterior del dado
// Para saber si se ha repetido necesitamos saber cual es el anterior
let anterior = 0
// Función hacemos lo típico de funciones de enlace:
// Obtenemos valores (en este caso no recuperamos ningún valor del HTML)
// LLamamos a las funciones que hacen los cálculos
// Mostramos resultados en la web
function tirar () {
// LLamamos a la función tirar dado
const resultado = tiradaDado()
// Mostramos el resultado de la tirada
document.getElementById('dado').innerHTML = resultado
// Mostramos los mensajes típicos del parchís
document.getElementById('mensaje').innerHTML = getMensaje(resultado)
// Comprobamos si se ha repetido
document.getElementById('repetido').innerHTML = repetido(resultado)
anterior = resultado
}
// Comprobamos si el resultado actual coincide con el anterior
// Si es así, devolvemos el mensaje de que ha vuelto a salir
function repetido (dado) {
if (dado == anterior) {
return 'Ha vuelto a salir el ' + dado
} else {
return ''
}
}
// Según el parchís con un 5 sales de casa y con un 6 vuelves a tirar
// Comprobamos el valor y devolvemos el mensaje correspondiente
function getMensaje (dado) {
if (dado == 5) {
return 'Sales de casa'
} else if (dado == 6) {
return 'Tiras otra vez'
} else {
return ''
}
}
// Usamos la fórmula de w3schools para obtener un número aleatorio entre 1 y 6
function tiradaDado () {
return Math.floor((Math.random() * 6) + 1)
}
