Juego Piedra Papel Tijeras en JavaScript

Juego Piedra Papel Tijeras en JavaScript

Juego Piedra Papel Tijeras en JavaScript

Enlace Patrocinado

Respondent.io

Respondent.io es una plataforma en línea que conecta investigadores y empresas con participantes para estudios de mercado y encuestas remuneradas. Su objetivo es facilitar la recopilación de datos cualitativos y cuantitativos mediante entrevistas, encuestas y pruebas de usuario

Octavo proyecto de la guia 50 Proyectos de Programacion para Practicar y Aprender. Proyectos para Principiantes

Enunciado del proyecto

Este juego permite al usuario elegir entre piedra, papel o tijeras para competir contra una elección aleatoria de la computadora. El programa muestra quién gana cada ronda.

Código HTML, CSS y JavaScript

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <title>Piedra, Papel o Tijeras</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
      padding: 30px;
      background-color: #f2f2f2;
    }
    button {
      padding: 10px 20px;
      margin: 10px;
      font-size: 16px;
    }
    #resultado {
      font-size: 20px;
      margin-top: 20px;
      font-weight: bold;
    }
  </style>
</head>
<body>

  <h2>Piedra, Papel o Tijeras</h2>

  <p>Elige tu opción:</p>
  <button onclick="jugar('piedra')">Piedra</button>
  <button onclick="jugar('papel')">Papel</button>
  <button onclick="jugar('tijeras')">Tijeras</button>

  <p id="resultado"></p>

  <script>
    function jugar(eleccionUsuario) {
      const opciones = ['piedra', 'papel', 'tijeras'];
      const eleccionComputadora = opciones[Math.
floor(Math.random() * 3)];

      let resultado = "";

      if (eleccionUsuario === eleccionComputadora) {
        resultado = "¡Empate! Ambos eligieron " + 
eleccionUsuario;
      } else if (
        (eleccionUsuario === 'piedra' && eleccionComputadora 
=== 'tijeras') ||
        (eleccionUsuario === 'papel' && eleccionComputadora
 === 'piedra') ||
        (eleccionUsuario === 'tijeras' && 
eleccionComputadora === 'papel')
      ) {
        resultado = "¡Ganaste! " + eleccionUsuario +
 " vence a " + eleccionComputadora;
      } else {
        resultado = "¡Perdiste! " + eleccionComputadora +
 " vence a " + eleccionUsuario;
      }

      document.getElementById("resultado").innerText = 
resultado;
    }
  </script>

</body>
</html>

Juego Piedra Papel Tijeras en JavaScript. Explicación del Código

  • HTML: Botones para que el usuario elija entre piedra, papel o tijeras, y un párrafo donde se muestra el resultado.
  • CSS: Estilos simples para mejorar la presentación.
  • JavaScript:
    • Math.random() elige una opción aleatoria para la computadora.
    • Se comparan las elecciones del usuario y la computadora para determinar el ganador.

Indice de la guia de proyectos

PCComponentes Black Friday hasta 60% de descuento #colaboracion #publicidad.

50 Proyectos de Programacion

Proyecto anterior

Groupon NOVIEMBRE DEALS Groupon llega con los mejores planes y descuentos para disfrutar al máximo la temporada. 🍂 🎟️ Actividades locales al mejor precio 💆 Bienestar, belleza y relax con descuentazos 🍽️ Restaurantes y experiencias únicas 🛍️ Ofertas exclusivas para ahorrar más 👉#colaboracion #publicidad.

Reloj Digital en JavaScript