Fundamentos de Programaci贸n

1

Bienvenida a Platzi: 驴qu茅 necesitas para tomar el curso?

2

驴C贸mo aprender programaci贸n?

3

Crea tu primer sitio web

4

Sitios web con HTML

5

Estructura de 谩rbol en HTML

6

Instalando tu primer editor de c贸digo

7

C贸mo declarar variables y usar prompt

8

Algoritmo de piedra, papel o tijera

9

Algoritmo avanzado de piedra, papel o tijera

10

Aleatoriedad

11

Refactor del c贸digo usando funciones

12

Ciclos

13

Gana 3 veces

14

Archivos de HTML y JavaScript

15

驴Qu茅 es el DOM?

Quiz: Fundamentos de Programaci贸n

Desarrollando un juego con HTML y JavaScript

16

Maquetaci贸n con HTML

17

Secci贸n de elegir mascota

18

驴D贸nde ubicar la etiqueta script? Conectando HTML con JavaScript

19

Escuchando eventos con JavaScript

20

addEventListener

21

Manipulaci贸n del DOM

22

Enemigos aleatorios

23

Ataques en JavaScript

24

Ataques aleatorios del enemigo

25

Imprimiendo ataques del enemigo

26

驴Ganaste, perdiste o empataste?

27

Tablas de verdad

28

Creando el contador de vidas

29

驴Qui茅n gan贸 el juego?

30

Reiniciando el juego

31

Ocultando elementos HTML con JS para mejorar la UX del juego

Quiz: Desarrollando un juego con HTML y JavaScript

Estilos con CSS

32

Anatom铆a de CSS

33

Tipos de display

34

Flexbox

35

Modelo de caja

36

Im谩genes para los Mokepones

37

Estilos del bot贸n

38

Adaptando HTML al dise帽o del juego

39

Layout: t铆tulo y ataques

40

Adaptando JavaScript al dise帽o del juego

41

CSS Grid

42

Responsive Design

43

Detalles finales

Quiz: Estilos con CSS

Optimizaci贸n de c贸digo

44

Revisi贸n de c贸digo

45

Don't repeat yourself (DRY)

46

Clases y objetos

47

Clases y objetos de Mokepon

48

Arrays o arreglos

49

Objetos vs. arreglos

50

Ciclos: manipulando el DOM con iteradores

51

Declaraci贸n lenta de variables

52

Una sola fuente de la verdad

53

Mascotas aleatorias con arreglos

54

Ataques din谩micos por cada mascota: extraer

55

Renderizado din谩mico en HTML

56

Eventos de click din谩micos

57

Secuencia de ataques del enemigo

58

Iniciando el combate

59

Resolviendo el reto de condicionales

60

Optimizando el frontend del juego

Quiz: Optimizaci贸n de c贸digo

Mapa con canvas

61

Introducci贸n a canvas: dibujando con JavaScript

62

Moviendo a Capipepo hacia la derecha

63

Movimiento hacia todas las direcciones

64

Movimientos con el teclado

65

Im谩genes y personajes de fondo

66

M茅todos en las clases

67

Obst谩culos y colisiones

68

Combate entre mokepones colisionados

69

Mapa responsive

70

Botones bonitos y viewport

Quiz: Mapa con canvas

Backend: videojuego multijugador

71

驴Qu茅 es backend?

72

Instalaci贸n de Node.js y NPM

73

Terminal de comandos y Node.js

74

Servidor web con Express.js

75

HTTP, localhost, servidores y puertos

76

Express.js y fetch: API REST con JavaScript

77

JSON y POST: mokepon online

78

Transmisi贸n de coordenadas

79

Mokepones din谩micos en el mapa

80

Optimizando el mapa del juego

81

Batalla entre jugadores

82

Consumiendo la API de ataques del enemigo

Quiz: Backend: videojuego multijugador

Pr贸ximos pasos

83

Probando el juego en varios dispositivos

84

驴Y ahora qu茅 curso tomar?

No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

驴Ganaste, perdiste o empataste?

26/84
Recursos

Aportes 467

Preguntas 160

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

Voy siguiendo el curso con una ligera variante

Lo resolvi con una o dos lineas dem谩s yo鈥

let resultado //com煤n a todas las funciones

function ataqueAleatorioEnemigo() {
    let ataqueAleatorio = aleatorio(1, 3)
    if (ataqueAleatorio == 1) {
        ataqueEnemigo = "FUEGO"
    } else if (ataqueAleatorio == 2){
        ataqueEnemigo = "AGUA"
    } else if (ataqueAleatorio == 3){
        ataqueEnemigo = "TIERRA"}
    
    combate()//se invoca la funci贸n aqu铆, antes de la de crearMensaje, para que la variable resultado ya tenga un valor establecido
    crearMensaje()
}

function combate() {
    if (ataqueJugador == ataqueEnemigo) {
      resultado = "EMPATE"
  } else if (ataqueJugador == "FUEGO" && ataqueEnemigo == "TIERRA") {
      resultado = "GANASTE"
  } else if (ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO") {
      resultado = "GANASTE"
  } else if (ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA") {
      resultado = "GANASTE"
  } else {resultado = "PERDISTE"}
}//En vez de invocar la funci贸n crearMensaje en cada una de las condicionantes se le asigna un valor a la variable resultado

function crearMensaje() {
    let sectionMensajes = document.getElementById("mensajes")
    let parrafo = document.createElement("p")
    parrafo.innerHTML = "Tu mascota atac贸 con " + ataqueJugador + ", la mascota del enemigo atac贸 con " + ataqueEnemigo + ": " + resultado
    sectionMensajes.appendChild(parrafo)
}

Muy bueno que en este curso nuevo de programaci贸n b谩sica utilicen let en js 馃挌

Descripci贸n. let te permite declarar variables limitando su alcance (scope) al bloque, declaraci贸n, o expresi贸n donde se est谩 usando. a diferencia de la palabra clave var la cual define una variable global o local en una funci贸n sin importar el 谩mbito del bloque.

para no crear muchos ELSE IF por cada victoria, yo lo que hice fue, meter todas las victorias en un solo ELSE IF, usando este operador 鈥渱|鈥

if(ataqueJugador == ataqueEnemigo){
	crearMensaje("EMPATE");
}else if(ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO" || ataqueJugador == "FUEGO" && ataqueEnemigo == "TIERRA"  || ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA"){
	crearMensaje("GANASTE");
}else{
	crearMensaje("perdiste");
}

Mejor explicado no puede haber, su forma de ense帽ar con animos y alegria, al usuario lo mantiene atento a la clase, cosa que no pasa con algunos prof de las universidades

Soy demasiado novata en esto, ten铆a miedo de empezar y siempre me preguntaba c贸mo hacen los programadores para saber qu茅 hacer en cada caso, pero creo que tengo la respuesta, y es hacer lo que hicieron en el caso anterior jajaja, me gusta estar entendiendo por fin!!

  1. Yo cree una variable global llamada resultadoDelCombate

  2. Cree una funci贸n llamada combate() la cual se ejecuta dentro de la funci贸n ataqueAleatoreoEnemigo() Justo antes de la funci贸n crearmensaje()

  3. La logica del combate es exactamente la misma del Piedra Papel o Tijera, donde por medio de los condicionales if, else if y else se define el resultado que se guarda en la variable global resultadoDelCombate.

  4. A帽ado la variable global resultadoDelCombate dentro de mi parrafo en la funcion crearMensaje()

voy a pasasr este juego a nft xD

As铆 lo resolv铆. Cre茅 una nueva variable global llamada resultado , luego cre茅 una funci贸n llamada combate y dentro de la funci贸n, el resultado del combate se lo asignaba a la variable resultado. Por 煤ltimo, el resultado lo concateno con el mensaje que se dispara en la funci贸n crearMensaje.

Yo de mokepon no se mucho de quien deber铆a ganar pero yo lo hice as铆:


//Se creo la variable resultado
let resultado

//Se hizo la funci贸n de resultado de batalla
function resultado_batalla(){
    if (ataqueEnemigo == ataqueJugador){
        resultado = "EMPATE"
    } else if (ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO"){
        resultado = "GANASTE"
    } else if (ataqueJugador == "TIERRA" && ataqueEnemigo == "FUEGO"){
        resultado = "GANASTE"
    } else if (ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA"){
        resultado = "GANASTE"
    } else{
        resultado = "PERDISTE"
    }
}

// Coloque la funci贸n antes de que se cree el mensaje
function ataqueAleatorioEnemigo(){
    let ataqueAleatorio = aleatorio(1,3)
    // let spanAtaqueEnemigo = document.getElementById("mascota-enemigo")

    if (ataqueAleatorio == 1){
        ataqueEnemigo = "FUEGO"
    }
    else if (ataqueAleatorio == 2){
        ataqueEnemigo = "AGUA"
    }
    else if (ataqueAleatorio == 3){
        ataqueEnemigo = "TIERRA"
    }

    resultado_batalla()
    crearMensaje() 
}

//Se agrego a la funci贸n de creanMensaje la variable resultado

function crearMensaje(){
    let sectionMensajes = document.getElementById("mensajes")

    let parrafo = document.createElement("p")
    parrafo.innerHTML = "Tu mascota atac贸 con " + ataqueJugador + ", la mascota del enemigo atac贸 con " + ataqueEnemigo + " " + resultado
    sectionMensajes.appendChild(parrafo)
}

Estuve dos dias, DOS DIAS隆隆隆隆 intentando solucionar un error, el error consist铆a que el resultado siempre me daba undefined, y lo que pasa es que estuve haciendo de todo para solucionar el dicho error, al fin lo encontr茅, y es que no estaba invocando a la funci贸n combate, que felicidad xd
no se olviden de revisar donde invocan las funciones, es reimportante ya que la soluci贸n no se encuentra en ninguna parte mas que en la l贸gica, y se los digo por que busque en muchas zonas como solucionar errores de directorio y eso, mucha suerte隆隆隆

vi en un comentario anterior a alguien usando 鈥渁nd/or鈥 || y me ha servido para agrupar todas las posiiblidades con e帽 mismo resultado, les dejo esa parte de mi codigo

function combate(){

if (ataqueJugador == ataqueEnemigo) {
    result = "EMPATE"
} else if (ataqueJugador == "FUEGO" && ataqueEnemigo == "TIERRA" || ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO" || ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA") {
    result = "GANASTE"
} else {
    result = "PERDISTE"
}

Yo lo resolv铆 de otra manera. Puse todo el combate dentro de la funci贸n crearMensaje que ya ten铆amos y no cambi茅 nada m谩s.
Me quedo asi:

let ataqueJugador
let ataqueEnemigo


function iniciarJuego(){
    let botonMascotaJugador = document.getElementById("boton-mascota")
    botonMascotaJugador.addEventListener("click", seleccionarMascotaJugador)

    let botonFuego = document.getElementById("boton-fuego")
    botonFuego.addEventListener("click", ataqueFuego)
    let botonAgua = document.getElementById("boton-agua")
    botonAgua.addEventListener("click", ataqueAgua)
    let botonTierra = document.getElementById("boton-tierra")
    botonTierra.addEventListener("click", ataqueTierra)


}

function seleccionarMascotaJugador(){
    let inputHipodoge = document.getElementById("hipodoge")
    let inputCapipepo = document.getElementById("capipepo")
    let inputRatigueya = document.getElementById("ratigueya")
    let spanMascotaJugador = document.getElementById("mascota-jugador")
        
    if (inputHipodoge.checked) {
        spanMascotaJugador.innerHTML = "Hipodoge"
    }  else if (inputCapipepo.checked) {
        spanMascotaJugador.innerHTML = "Capipepo"
    }  else if (inputRatigueya.checked) {
        spanMascotaJugador.innerHTML = "Ratigueya"
    }  else {
        alert("Todav铆a no seleccionaste a tu mascota")
    }

    seleccionarMascotaEnemigo()
    
}
function seleccionarMascotaEnemigo() {
    let mascotaAleatoria = aleatorio(1,3)
    let spanMascotaEnemigo = document.getElementById("mascota-enemigo")

    if (mascotaAleatoria == 1) {
        spanMascotaEnemigo.innerHTML = "Hipodoge"
    } else if (mascotaAleatoria == 2) {
        spanMascotaEnemigo.innerHTML = "Capipepo"
    } else {
        spanMascotaEnemigo.innerHTML = "Ratigueya"
    } 
}


function ataqueFuego() {
    ataqueJugador = "FUEGO"
    ataqueAleatorioEnemigo()
}
function ataqueAgua() {
    ataqueJugador = "AGUA"
    ataqueAleatorioEnemigo()
}
function ataqueTierra() {
    ataqueJugador = "TIERRA"
    ataqueAleatorioEnemigo()
}

function ataqueAleatorioEnemigo() {
    let ataqueAleatorio = aleatorio(1,3)

    if (ataqueAleatorio == 1) {
        ataqueEnemigo = "FUEGO"
    } else if (ataqueAleatorio == 2) {
        ataqueEnemigo = "AGUA"
    } else {
        ataqueEnemigo = "TIERRA"
    }

    crearMensaje()
}    


function crearMensaje() {
    let resultado
    if (ataqueJugador == ataqueEnemigo) {
        resultado = "Empate 馃"
    } else if ((ataqueJugador == "FUEGO" && ataqueEnemigo == "TIERRA") || (ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO") || (ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA")) {
        resultado = "Ganaste! 馃帀"
    } else if ((ataqueJugador == "FUEGO" && ataqueEnemigo == "AGUA") || (ataqueJugador == "AGUA" && ataqueEnemigo == "TIERRA") || (ataqueJugador == "TIERRA" && ataqueEnemigo == "FUEGO")) {
        resultado = "Perdiste! 馃槶"
    }

    let sectionMensajes = document.getElementById("mensajes")

    let parrafo = document.createElement("p")
    parrafo.innerHTML = "Tu mascota atac贸 con " + ataqueJugador + ", la mascota del enemigo atac贸 con " + ataqueEnemigo + ". " + resultado

    sectionMensajes.appendChild(parrafo)

}

function aleatorio(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min)
}

window.addEventListener("load", iniciarJuego) 

Vamos que vamos馃憦馃檶

Me pas贸 lo de los memes鈥

Hice una soluci贸n distinta a la del maestro, primero no funcion贸 entonces us茅 la soluci贸n de 茅l. Pero me di cuenta de un error y volv铆 a intentar con mi soluci贸n y funcion贸.

Aunque si les soy honesto, no tengo ni pta idea de por qu茅 mi c贸digo funciona xd

Est谩 fue la manera como lo resolv铆. El c贸digo me funciona sin embargo es algo diferente a como lo realiz贸 El profe Juan David

gracias platzi tengo trece a帽os y es muy genial y facil aprender con ustedes una pregunta mi pagina se creshea al momento de aplicar un while

//#region variablesId
    
    //#region buttonsId
        let petButton = document.getElementById("selectPet");
        let fireButtonAttack = document.getElementById("fireAttack");
        let waterButtonAttack = document.getElementById("waterAttack");
        let earthButtonAttack = document.getElementById("earthAttack");
    //#endregion

    //#region petsId
        let hipodogeId = document.getElementById("hipodoge");
        let capipepoId = document.getElementById("capipepo");
        let ratigueyaId = document.getElementById("ratigueya");
        let langostelvisId = document.getElementById("langostelvis");
        let tucapalmaId = document.getElementById("tucapalma");
        let pydosId = document.getElementById("pydos");
    //#endregion

    //#region dataPetsId
    let petToThePlayer = document.getElementById("petToPlayer");
    let petToThePlayerLives = document.getElementById("livesToPetToPlayer");
    let petToTheEnemy = document.getElementById("petToEnemy");
    let petToTheEnemyLives = document.getElementById("livesToPetToEnemy");

    
    labelP = document.getElementById("messages");
    //#endregion

//#endregion

//#region normalVars
    
    let playerPetName;
    let pcPetName;
    let playerSiSelecionaste;
    let pcSiSelecionaste;
    let playerAttack;
    let playerAttackName;
    let pcAttack;
    let pcAttackName;

    var attackPlayerText;
    var attackPCText;
    var vicOderText;
    var pcPetText;
    var playerPetText;
    var winsPlayer = 0;
    var winsPC = 0;
    var quienGano;

//#endregion

//#region events
    fireButtonAttack.addEventListener("click",buttonFireAttack);
    waterButtonAttack.addEventListener("click",buttonWaterAttack);
    earthButtonAttack.addEventListener("click",buttonEarthAttack);

//#endregion

//#region importantExtra
function aleatorio(min,max)
{
    return Math.floor(Math.random() * (max - min + 1) + min );
}

function startGame()
{
    petButton.addEventListener("click",playerSelectPet);
}

function drawText(messageText)
{
    var newMessage = document.createElement("p");
    
    labelP.appendChild(newMessage);
    newMessage.innerHTML = messageText;
}

//#endregion

//#region player

function playerSelectPet()
{

    if (hipodogeId.checked == true)
    {
        playerSiSelecionaste = "has seleccionado a: ";
        playerPetName = " Hipodoge ";
        petToThePlayer.innerHTML = playerPetName + "";
    }
    else if (capipepoId.checked == true)
    {
        playerSiSelecionaste = "has seleccionado a: ";
        playerPetName = " Capipepo ";
        petToThePlayer.innerHTML = playerPetName + "";
    }
    else if (ratigueyaId.checked == true)
    {
        playerSiSelecionaste = "has seleccionado a: ";
        playerPetName = " Ratigueya ";
        petToThePlayer.innerHTML = playerPetName + "";
    }
    else if (langostelvisId.checked == true)
    {
        playerSiSelecionaste = "has seleccionado a: ";
        playerPetName = " Langostelvis ";
        petToThePlayer.innerHTML = playerPetName + "";
    }
    else if (tucapalmaId.checked == true)
    {
        playerSiSelecionaste = "has seleccionado a: ";
        playerPetName = " Tucapalma ";
        petToThePlayer.innerHTML = playerPetName + "";
    }
    else if (pydosId.checked == true)
    {
        playerSiSelecionaste = "has seleccionado a: ";
        playerPetName = " Pydos ";
        petToThePlayer.innerHTML = playerPetName + "";
    }
    else
    {
        playerSiSelecionaste = "";
        playerPetName = "no has seleccionado ningun mokepon";
        petToThePlayer.innerHTML = "";
    }

    playerPetText = playerSiSelecionaste + playerPetName;

    drawText(playerPetText);

    attackPlayerText = "el ataque de tu mascota " +  playerPetName + " es de " + playerAttackName;
    vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;

    pcSelectPet();

}

function buttonFireAttack()
{
    playerAttack = 0;
    playerAttackName = "FUEGO";
    attackPlayerText = "el ataque de tu mascota " +  playerPetName + " es de " + playerAttackName;
    drawText(attackPlayerText);
    vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;
    pcSelectAttack();
}

function buttonWaterAttack()
{
    playerAttack = 1;
    playerAttackName = "AGUA";
    attackPlayerText = "el ataque de tu mascota " +  playerPetName + " es de " + playerAttackName;
    drawText(attackPlayerText);
    vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;
    pcSelectAttack();
}

function buttonEarthAttack()
{
    playerAttack = 2;
    playerAttackName = "TIERRA";
    attackPlayerText = "el ataque de tu mascota " +  playerPetName + " es de " + playerAttackName;
    drawText(attackPlayerText);
    vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;
    pcSelectAttack();
}

//#endregion

//#region pc

function pcSelectPet()
{

    let resultadoAleatorio = aleatorio(1,6);

    if (resultadoAleatorio == 1)
    {
        pcSiSelecionaste = " tu oponente ha seleccionado a:  ";
        pcPetName = " Hipodoge ";
        petToEnemy.innerHTML = pcPetName + "";
    }
    else if (resultadoAleatorio == 2)
    {
        pcSiSelecionaste = " tu oponente ha seleccionado a:  ";
        pcPetName = " Capipepo ";
        petToEnemy.innerHTML = pcPetName + "";
    }
    else if (resultadoAleatorio == 3)
    {
        pcSiSelecionaste = " tu oponente ha seleccionado a: ";
        pcPetName = " Ratigueya ";
        petToEnemy.innerHTML = pcPetName + "";
    }
    else if (resultadoAleatorio == 4)
    {
        pcSiSelecionaste = " tu oponente ha seleccionado a: ";
        pcPetName = " Langostelvis ";
        petToEnemy.innerHTML = pcPetName + "";
    }
    else if (resultadoAleatorio == 5)
    {
        pcSiSelecionaste = " tu oponente ha seleccionado a: ";
        pcPetName = " Tucapalma ";
        petToEnemy.innerHTML = pcPetName + "";
    }
    else if (resultadoAleatorio == 6)
    {
        pcSiSelecionaste = " tu oponente ha seleccionado a: ";
        pcPetName = " Pydos ";
        petToEnemy.innerHTML = pcPetName + "";
    }

    pcPetText = pcSiSelecionaste + pcPetName;

    drawText(pcPetText);

    attackPCText = "el ataque de la mascota enemiga " +  pcPetName + " es de " + pcAttackName;
    vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;

}

function pcSelectAttack()
{
    let resultadoAleatorio = aleatorio(1,3);

    if (resultadoAleatorio == 1)
    {
        pcAttack = 0;
        pcAttackName = "FUEGO"; 
    }

    else if (resultadoAleatorio == 2)
    {
        pcAttack = 1;
        pcAttackName = "AGUA";
    }

    else
    {
        pcAttack = 2;
        pcAttackName = "TIERRA";
    }

    attackPCText = "el ataque de la mascota enemiga " +  pcPetName + " es de " + pcAttackName;
    vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;

    drawText(attackPCText);

    battle();

}

//#endregion

function battle()
{

    //while(winsPlayer < 3 || winsPC < 3)
    //{
        if (playerAttack == pcAttack)
        {
            winsPlayer = winsPlayer;
            winsPC = winsPC;
            quienGano = " EMPATE ";
        
            vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;
            drawText(vicOderText);
        }
        else
        {
            if (playerAttack == 0 && pcAttack == 2)
            {
                winsPlayer += 1;
                quienGano = " GANASTE ";

                vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;
                drawText(vicOderText);
            }
            else if (playerAttack == 1 && pcAttack == 0)
            {   
                winsPlayer += 1;
                quienGano = " GANASTE ";

                vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;
                drawText(vicOderText);
            }
            else if (playerAttack == 2 && pcAttack == 1)
            {
                winsPlayer += 1;
                quienGano = " GANASTE ";

                vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;
                drawText(vicOderText);
            }
            else
            {
                winsPC += 1;
                quienGano = " PERDISTE ";

                vicOderText = playerPetName + winsPlayer + " - " + winsPC + pcPetName + quienGano;
                drawText(vicOderText);
            }

        }

Mi solucion fue crear una nueva variable al inicio llamada 鈥渃ombatPlay鈥

let attackPlayer
let attackEnemy
let combatPlay

Y luego a la funcion del combate, sustitui las alertas por la variable creada. Por ultimo hice una concatenacion con el resultado

function combat() {
    if(attackPlayer == attackEnemy) {
        combatPlay = "Empate"
    } 	else if(attackPlayer == "Fuegardo" && attackEnemy == "Hierbajo") {
        combatPlay = "Ganaste"
    } 	else if(attackPlayer == "Aguado" && attackEnemy == "Fuegardo") {
        combatPlay = "Ganaste"		
    }  	else if(attackPlayer == "Hierbajo" && attackEnemy == "Aguado") {
        combatPlay = "Ganaste"	
    } 	else {
        combatPlay = "Perdiste"
    }

    Textcombat()
}

function Textcombat() {
    let sectionMensajes=document.getElementById("mensajes")
    let parrafo=document.createElement("p")

    parrafo.innerHTML="Tu pet ataco con " + attackPlayer + ", la pet del enemigo ataco con " + attackEnemy + " " + combatPlay
    sectionMensajes.appendChild(parrafo)


lo estoy logrando

Otra forma de concatenar con comillas invertidas

parrafo.innerHTML = `Tu mascota ataco con ${ataqueJugador} , la mascota del enemigo ataco con ${ataqueEnemigo} - ${resultado}馃帀`

function combate(pc, jugador) {
//combate
if (ataquePC == ataqueJug) {
mensaje = 鈥淓mpate鈥
} else if (ataqueJug == 鈥淔UEGO鈥 && ataquePC == 鈥淭IERRA鈥) {
mensaje = 鈥淕anaste鈥
} else if (ataqueJug == 鈥淎GUA鈥 && ataquePC == 鈥淔UEGO鈥) {
mensaje = 鈥淕anaste鈥
} else if (ataqueJug == 鈥淭IERRA鈥 && ataquePC == 鈥淎GUA鈥) {
mensaje = 鈥淕anaste鈥
} else {
mensaje = 鈥淧erdiste鈥
}
setMensage(mensaje)
}

function setMensage(mensajeRes) {
let sectionMessage = document.getElementById(鈥榤ensajes鈥)
let parrafo = document.createElement(鈥榩鈥)
parrafo.innerHTML = "tu mascota ataco con " + ataqueJug + ", la mascota del PC ataco con " + ataquePC + " " + mensajeRes
sectionMessage.appendChild(parrafo)
}

DEJO MI SOLUCION DE COMO PONER EL RESULTADO!!! 馃榿

As铆 lo llevo al momento, lo ir茅 personalizando con el transcurso del curso le quiero poner mas poderes seg煤n sus personajes y animaciones.

Aui mi aporte con ataques combinados:

//CLAVE PARA GANAR:
//AGUA le gana al FUEGO
//TIERRA le gana al AGUA
//FUEGO le gana a la TIERRA


//variables de vidas
let vidasJugador1 = 3
let vidasJugador2 = 3


// Funci贸n para saber qui茅n gana
    function compararAtaques(ataqueElegidoJugador1, ataqueElegidoJugador2) {
        let spanVidasJugador1 = document.getElementById('vidas-jugador1')
        let spanVidasJugador2 = document.getElementById('vidas-jugador2')

        if (vidasJugador1 > 0 && vidasJugador2 > 0) {
            // let spanVidasJugador1 = document.getElementById('vidas-jugador1')
            // let spanVidasJugador2 = document.getElementById('vidas-jugador2')
            //Cuando el jugador gana
            if((ataqueElegidoJugador1 == "AGUA" && ataqueElegidoJugador2 == "FUEGO")
                || (ataqueElegidoJugador1 == "TIERRA" && ataqueElegidoJugador2 == "AGUA")
                || (ataqueElegidoJugador1 == "FUEGO" && ataqueElegidoJugador2 == "TIERRA")) {

                vidasJugador2 = vidasJugador2 - 1
                spanVidasJugador2.innerHTML = vidasJugador2.toFixed(1)
                if (vidasJugador2 < 0) {
                    spanVidasJugador2.innerHTML = vidasJugador2 - vidasJugador2
                }
                console.log("JUADOR1 GAN脫",vidasJugador1, vidasJugador2)

            //Cuando el jugador empata
            } else if(ataqueJugador1 == ataqueJugador2) {

                vidasJugador1 = vidasJugador1 - 0.5
                spanVidasJugador1.innerHTML = vidasJugador1.toFixed(1)
                vidasJugador2 = vidasJugador2 - 0.5
                spanVidasJugador2.innerHTML = vidasJugador2.toFixed(1)

                if (vidasJugador1 < 0 || vidasJugador2 < 0) {
                    spanVidasJugador1.innerHTML = vidasJugador1 - vidasJugador1
                    spanVidasJugador2.innerHTML = vidasJugador2 - vidasJugador2
                }
                
                console.log("EMPATARON", vidasJugador1, vidasJugador2)
            
            //Cuando el jugador pierde
            } else {
                
                vidasJugador1 = vidasJugador1 - 1
                spanVidasJugador1.innerHTML = vidasJugador1.toFixed(1)

                if (vidasJugador1 < 0) {
                    spanVidasJugador1.innerHTML = vidasJugador1 - vidasJugador1
                }

                console.log("JUGADOR1 PERDI脫", vidasJugador1, vidasJugador2)
            }
        } else if (vidasJugador1 < 0 || vidasJugador2 < 0) {
            spanVidasJugador1.innerHTML = vidasJugador1 - vidasJugador1
            spanVidasJugador2.innerHTML = vidasJugador2 - vidasJugador2

        }
    }

Yo lo resolv铆 un poco diferente, pero funciona igual. Ac谩 les comparto mi aporte (s贸lo puse las funciones implicadas):

let resultado //creo una variable global vac铆a

function ataqueAleatorioEnemigo() {
    ataqueAleatorio = aleatorio(1, 3)

    if (ataqueAleatorio == 1) {
        ataqueEnemigo = 'FUEGO'
    }
    else if (ataqueAleatorio == 2) {
        ataqueEnemigo = 'AGUA'
    }
    else {
        ataqueEnemigo = 'TIERRA'
    }
    combate()
    //agrego ac谩 la funci贸n combate para que modifique la variable resultado
    crearMensaje()
}

function ataqueAleatorioEnemigo() {
    ataqueAleatorio = aleatorio(1, 3)

    if (ataqueAleatorio == 1) {
        ataqueEnemigo = 'FUEGO'
    }
    else if (ataqueAleatorio == 2) {
        ataqueEnemigo = 'AGUA'
    }
    else {
        ataqueEnemigo = 'TIERRA'
    }
    combate()
    //agrego ac谩 la funci贸n combate para que modifique la variable resultado
    crearMensaje()
}

function crearMensaje() {
//condicional para obligar a usuario a elegir primero un mokepon
    if(mascotaSeleccionada) {
        let seccionMensaje = document.getElementById('mensajes')

        let parrafo = document.createElement("p")
        parrafo.innerHTML = 'Tu mascota atac贸 con ' + ataqueJugador + ', la mascota del enemigo atac贸 con ' + ataqueEnemigo + ' - ' + resultado

        seccionMensaje.appendChild(parrafo)
        } else {
            alert('Selecciona primero un Mokepon')
        }
}

function combate() {
    if(ataqueJugador == ataqueEnemigo){
        resultado = 'EMPATE'
    } else if(ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA' || ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO' || ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA'){
        resultado = 'GANASTE! 馃帀'
    }
    else{
        resultado = 'PERDISTE 馃様'
    }
}

Ahora con la logica que llevamos solo debemos mostrar por medio de un mensaje al usuario si gan贸, empat贸 o perdi贸

Para ello se implementar谩 un c贸digo similar al del juego de piedra papel o tijera para poder definir el estado del jugador

function combate(){
    let estado;
    if (ataqueJugador == ataqueEnemigo) {
        estado = "EMPATE";
    }else if (ataqueJugador == "FUEGO"  && ataqueEnemigo == "TIERRA") {
        estado = "GANASTE";
    }else if(ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO" ){
        estado = "GANASTE";
    }else if(ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA"){
        estado = "GANASTE";
    }else{
        estado = "PERDISTE";
    }
    crearMensaje(estado);
}

Con esto ya estamos del otro lado

Mi soluci贸n fue crear una variable global 鈥渞esultadoCombate鈥, us茅 la misma logica para el combate y al final en el mensaje concaten茅 la variable 鈥渞esultadoCombate鈥

function combate(){
    if (ataqueJugador=="FUEGO" && ataqueEnemigo=="TIERRA" || ataqueJugador=="TIERRA" && ataqueEnemigo=="AGUA" || ataqueJugador=="AGUA" && ataqueEnemigo=="FUEGO"){
        resultadoCombate = "Ganaste!! 馃帀"

    } else if(ataqueJugador==ataqueEnemigo){
        resultadoCombate = "Empate"

    } else {
        resultadoCombate= "Perdiste!!"
    }
}

Les comparto mi c贸digo

function combate(){
    if ( ataqueJugador == ataqueEnemigo ){
        crearMensaje("饾悇饾悓饾悘饾悁饾悡饾悇");
    }   
    else if( (ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA') ||
    ( ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO') ||
    ( ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA')){
        crearMensaje("鉁 饾悊饾悁饾悕饾悁饾悞饾悡饾悇 鉁");
    }
    else{
        crearMensaje(" 鈽 饾悘饾悇饾悜饾悆饾悎饾悞饾悡饾悇 鈽 ");
        }
}

function crearMensaje(resultado){
    let section_mensaje = document.getElementById('mensajes');
    let parrafo = document.createElement('p');
    parrafo.innerHTML = "Tu mascota atac贸 con " + ataqueJugador + ", la mascota del enemigo atac贸 con " + ataqueEnemigo + " 鈬" + resultado;
    section_mensaje.appendChild(parrafo);
}

el fuego le gana a la planta pero no a la tierra, la tierra le gana al fuego. buen video profe !

Que emocion ver que todo funciona.

Yo no cre茅 ninguna funci贸n nueva. yo solo hice lo siguiente:

<code> 
function crearMensaje() {
	let seccionMensajes = document.getElementById('Mensajes')

    let parrafo = document.createElement('p')

    parrafo.innerHTML = 'Tu mascota atac贸 con ' + ataqueJugador + ', la mascota del enemigo atac贸 con ' + ataqueEnemigo

    if(ataqueJugador == ataqueEnemigo) {
        parrafo.innerHTML += ' - EMPATE 馃'
    } else if((ataqueJugador == "FUEGO" && ataqueEnemigo == "TIERRA") || (ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO") || (ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA")) {
        parrafo.innerHTML += ' - GANASTE 馃帀'
    } else {
        parrafo.innerHTML += ' - PERDISTE 馃槥'
    }

    seccionMensajes.appendChild(parrafo)
}

Solo con unas pocas condiciones y aritm茅tica de strings b谩sica ubicadas antes del appendChild se junta todo. y en caso de que fuese dif铆cil de entender con simples comentarios se aclara el contexto =)

En mi caso lo resolvi de la siguiente manera, aplicando lo aprendido hasta aqui

  1. He creado una variable global llamada resultado
  2. Cre茅 una funci贸n llamada resultadoJuego() y alli meti la logica de programaci贸n, utilizando las variables globales, aqui debo devolver el valor de variable resultado con return al final

    3.Finalmente lo concatene al mensaje llamando a mi funci贸n resultadoJuego()

asi solucione del ataque

Amigos! Despu茅s de dos horas escribiendo y borrando puede hacer que me funcionara el juego 馃槃

![](url )
![](url )

si en la funcion combate creo una variable resultado y la retorno, puedo llamar a la funcion combate en la funcion crearMensaje concatenandola al final asi= parrafo.innerHTML='tu mascota ataco con '+ataqueJugador+' , la mascota del enemigo ataco con '+ataqueEnemigo+combate() Mi pc se descompuso no lo puedo probar pero dejo aqui mi aporte.
lo que yo realice fue crear dos funciones m谩s, con el nombre de crearMensajeEmpate() y crearMensajePerder() cambiando solo el 煤ltimo valor dependiendo del caso y llamando esas funciones en cada else if correspondiente copiar y pegar y listo 馃憤

mi codigo vari贸 un poco, porque puse una variable global llamada 鈥渞esultado鈥, as铆 poder usarla cuando la necesite

let ataqueJugador
let ataqueEnemigo
let resultado

function iniciarJuego (){
    let botonMascotaJuagador = document.getElementById('boton-mascota')
    let botonFuego = document.getElementById('boton-fuego')
    let botonAgua = document.getElementById('boton-agua')
    let botonTierra = document.getElementById('boton-tierra')
    


    botonMascotaJuagador.addEventListener('click', seleccionarMascotaJugador)
    botonFuego.addEventListener('click', ataqueFuego)
    botonAgua.addEventListener('click', ataqueAgua)
    botonTierra.addEventListener('click', ataqueTierra)
    
}

function seleccionarMascotaJugador(){

    let inputhipodoge = document.getElementById('hipodoge')
    let inputcapipepo = document.getElementById('capipepo')
    let inputratigueya = document.getElementById('ratigueya')
    let inputlangostelvis = document.getElementById('langostelvis')
    let inputtucapalma = document.getElementById('tucapalma')
    let inputpydos = document.getElementById('pydos')
    let spanMascotaJugador = document.getElementById('mascota-jugador')


    if (inputhipodoge.checked) {
        spanMascotaJugador.innerHTML = 'Hipodoge'
        //alert("has seleccionado Hipodoge")

    }   else if (inputcapipepo.checked) {
        spanMascotaJugador.innerHTML = 'Capipepo'
        //alert("has seleccionado Capipepo")

    }   else if (inputratigueya.checked) {
        spanMascotaJugador.innerHTML = 'Ratigueya'
        //alert("has seleccionado Ratigueya")

    }   else if (inputlangostelvis.checked) {
        spanMascotaJugador.innerHTML = 'Langostelvis'
        //alert("has seleccionado Langostelvis")

    }   else if (inputtucapalma.checked) {
        spanMascotaJugador.innerHTML = 'Tucapalma'
        //alert("has seleccionado Tucapalma")

    }   else if (inputpydos.checked) {
        spanMascotaJugador.innerHTML = 'Pyros'
        //alert("has seleccionado Pyros")

    }   else {
        alert ("debes seleccionar un mokepon")
    } 
    seleccionarMascotaEnemiga()

} 
function seleccionarMascotaEnemiga(){
   let mascotaAleatoria = aleatorio(1,6)
   let spanMascotaEnemiga = document.getElementById('mascota-enemiga')

    if (mascotaAleatoria == 1) {
        spanMascotaEnemiga.innerHTML = 'Hipodoge'
    }   else if (mascotaAleatoria == 2) {

        spanMascotaEnemiga.innerHTML = 'Capipepo'
    }   else if (mascotaAleatoria == 3) {

        spanMascotaEnemiga.innerHTML = 'Ratigueya'
    }   else if (mascotaAleatoria == 4) {

        spanMascotaEnemiga.innerHTML = 'Langostelvis'
    }   else if (mascotaAleatoria == 5) {

        spanMascotaEnemiga.innerHTML = 'Tucapalma'
    }   else {

        spanMascotaEnemiga.innerHTML = 'Pyros'
    }
}

function ataqueFuego () {
    ataqueJugador = 'FUEGO'
    ataqueAleatorioEnemigo ()


}
function ataqueAgua () {
    ataqueJugador = 'AGUA'
    ataqueAleatorioEnemigo ()
    
}
function ataqueTierra () {
    ataqueJugador = 'TIERRA'
    ataqueAleatorioEnemigo ()
    
}
function ataqueAleatorioEnemigo () {
    let ataqueAleatorio = aleatorio(1,3)

    if (ataqueAleatorio == 1) {

    ataqueEnemigo = 'FUEGO'

    }   else if (ataqueAleatorio == 2) {
    ataqueEnemigo = 'AGUA'

    }   else {
    ataqueEnemigo = 'TIERRA'

    }
    combate ()
    crearMensaje ()
    

}

function crearMensaje () {
    
    let seccionMensajes = document.getElementById ('mensajes')
    let parrafo = document.createElement ('p')
    parrafo.innerHTML = 'Tu mascota atac贸 con ' + ataqueJugador + ' , la mascota enemiga atac贸 con ' + ataqueEnemigo + ", " + resultado

    seccionMensajes.appendChild (parrafo)
    
}

function combate () {
    if ( ataqueJugador == ataqueEnemigo) {
    resultado = 'EMPATE'
    } else if (ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA') {
        resultado = 'GANASTE'

    }else if (ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO') {
        resultado = 'GANASTE'

    }else if (ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA') {
        resultado = 'GANASTE'
    } else{
        resultado = 'PERDISTE'
    }
}

function aleatorio(min, max){
    return Math.floor(Math.random() * (max - min + 1) + min)
}


Use una variable global llamada v_resultado donde guardaba el resultado de la batalla y de hay concatenaba el texto en el parrafo creado

Logr茅 hacerlo creando una nueva variable global (resultado), y cree una funci贸n (batalla) similar al piedra, papel, tijera, donde resultado era EMPATE, GANASTE o PERDISTE, luego llame a la nueva funci贸n antes antes de la funci贸n crearMensaje.

let ataqueJugador
let ataqueEnemigo
let resultado

function iniciarJuego () {
    let botonMascotaJugador = document.getElementById('boton-mascota')
    botonMascotaJugador.addEventListener('click', seleccionarMascotaJugador)
    
    let botonFuego = document.getElementById('boton-fuego')
    botonFuego.addEventListener('click', ataqueFuego)
    let botonAgua = document.getElementById('boton-agua')
    botonAgua.addEventListener('click', ataqueAgua)
    let botonTierra = document.getElementById('boton-tierra')
    botonTierra.addEventListener('click', ataqueTierra)
}

function seleccionarMascotaJugador () {
    
    let hipogue = document.getElementById('hipodoge').checked
    let capipepo = document.getElementById('capipepo').checked
    let ratigueya = document.getElementById('ratigueya').checked
    let spamJugador = document.getElementById('mascota-jugador')

    if (hipogue == true) {
        spamJugador.innerHTML = 'Hipodogue'
    } else if (capipepo == true) {
        spamJugador.innerHTML = 'Capipepo'
    } else if (ratigueya == true) {
        spamJugador.innerHTML = 'Ratigueya'
    } else  {
        alert ("Seleciona a una mascota") 
    }  
    
    seleccionarMascotaEnemigo ()
}

function aleatorio (min, max){
    return Math.floor(Math.random()*(max - min +1) + min)
}

function seleccionarMascotaEnemigo () {
    let mascotaAleatorio = aleatorio (1, 3)
    let spamEnemigo = document.getElementById('mascota-enemigo')

    if ( mascotaAleatorio == 1){
        spamEnemigo.innerHTML = 'Hipodogue'
    } else if (mascotaAleatorio == 2){
        spamEnemigo.innerHTML = 'Capipepo'
    } else {
        spamEnemigo.innerHTML = 'Ratigueya'
    }

}

function ataqueFuego () {
    ataqueJugador = "FUEGO"
    ataqueAleatorioEnemigo ()
}

function ataqueAgua () {
    ataqueJugador = "AGUA"
    ataqueAleatorioEnemigo ()
}

function ataqueTierra () {
    ataqueJugador = "TIERRA"
    ataqueAleatorioEnemigo ()
}

function ataqueAleatorioEnemigo (){
    let numAleatorio = aleatorio(1, 3)
    if ( numAleatorio == 1){
        ataqueEnemigo = "FUEGO"
    } else if ( numAleatorio == 2){
        ataqueEnemigo = "AGUA"
    } else if ( numAleatorio == 3){
        ataqueEnemigo = "TIERRA"
    }

    batalla ()

    crearMensaje ()
}


function batalla (){   
    if (ataqueJugador == ataqueEnemigo){
        resultado = "EMPATE"
    } else if (ataqueJugador == "FUEGO" && ataqueEnemigo == "TIERRA"){
        resultado = "GANASTE"
    } else if (ataqueJugador == "AGURA" && ataqueEnemigo == "FUEGO"){
        resultado = "GANASTE"
    } else if (ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA"){
        resultado = "GANASTE"
    } else {
        resultado = "PERDISTE"
    }
}

function crearMensaje () {
    let seccionMensajes= document.getElementById('mensajes')

    let parrafo = document.createElement('p')
    parrafo.innerHTML = 'Tu mascota atac贸 con ' + ataqueJugador + ',  la mascota del enemigo atac贸 con ' + ataqueEnemigo + " " + resultado

    seccionMensajes.appendChild(parrafo)
}

window.addEventListener('load',iniciarJuego)

Hola gente鈥
Lo que hice fue, crear una variable global y en la funci贸n combate asignarle a la variable el valor de 鈥渆mpate鈥, 鈥済anaste鈥 o 鈥減erdiste鈥 y despu茅s solo concatenarla en la funci贸n crear mensaje.

El resultado del combate lo resolv铆 creado secciones y dej谩ndole el display apagado y seg煤n la validaci贸n, mostr茅 la secci贸n de mensaje que dice que gane, perd铆 o empate

Yo declare una nueva variable global llamada 鈥渞esultado鈥 que utilice en la funci贸n 鈥渃ombate()鈥 para asignarle los siguientes valores:
" - EMPATE."
" - GANASTE. 鈥
鈥 - PERDISTE."
Dependiendo de el resultado de las comparaciones. Dentro de la funci贸n 鈥渃ombate鈥 mande llamar la funci贸n 鈥渃rearMensaje(resultado)鈥 pasando le como par谩metro la variable 鈥渞esultado鈥.

function crearMensaje(resultado){
    let sctMensajes = document.getElementById("mensajes");
    let parrafo = document.createElement("p");

    parrafo.innerHTML = "Tu mascota atac贸 con " + ataqueJugador + ", la mascota del enemigo atac贸 con " + ataqueEnemigo + " " + resultado;
    sctMensajes.appendChild(parrafo);
}

function combate(){

    if(ataqueJugador == ataqueEnemigo){
        resultado = " - EMPATE."
    } else if (ataqueJugador == "FUEGO" && ataqueEnemigo == "TIERRA"){
        resultado = " - GANASTE. 馃弳"
    } else if (ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO"){
        resultado = " - GANASTE. 馃弳"
    } else if (ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA"){
        resultado = " - GANASTE. 馃弳"
    } else {
        resultado = " - PERDISTE. 馃槙"
    }

    crearMensaje(resultado);
}

**Logr茅 el mismo resultado con una variaci贸n. **
En vez de usar resultado como un par谩metro, lo dej茅 como una variable para if, y dej茅 hasta el final la funci贸n de crear mensaje, ya que cualquier opci贸n que elijan se convertir谩 en un mensaje! Alguien m谩s lo hizo as铆 o saben las complicaciones que puede tener a futuro hacerlo de esta manera?

function combate() {
    if(ataqueJugador == ataqueEnemigo) {
        resultadoCombate = "EMPATE"
    } else if (ataqueJugador == "FUEGO" && ataqueEnemigo == "TIERRA") {
        resultadoCombate = "VICTORIA"
    } else if (ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO") {
        resultadoCombate = "VICTORIA"
    } else if (ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA") {
        resultadoCombate = "VICTORIA"
    } else {
        resultadoCombate = "DERROTA"
    }
    crearMensaje()
}


Hice unos textos para hacerles saber a los jugadores cuales son los PROS y CONTRAS de los poderes

function combate() {
    let resultadoAtaque

    if ( ataqueEnemigo == ataqueJugador ) {
        alert( "隆EMPATE! 馃ぜ" )
        resultadoAtaque = 'EMPATE'
    }
    else if ((ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA') || ( ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO' ) || ( ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA' )){
        alert( "隆GANASTE! 馃コ"  )
        resultadoAtaque = 'GANASTE'
    }
    else {
        alert( "PERDISTE... 馃槩" )
        resultadoAtaque = 'PERDISTE'
    }
    crearMensaje(resultadoAtaque)
}

function crearMensaje(resultadoAtaque) {
    let sectionMensajes = document.getElementById('mensajes')

    let parrafo = document.createElement('p')
    parrafo.innerHTML = 'Tu mascota atac贸 con ' + ataqueJugador + ' la mascota del enemigo atac贸 con ' + ataqueEnemigo + ' - ' + resultadoAtaque

    sectionMensajes.appendChild(parrafo)
}

logr茅 hacerlo antes de que Juan David Castro lo hiciera鈥 Mi l贸gica funcion贸 馃槉馃槉馃檵鈥嶁檪锔

Una alternativa mas b谩sica supongo鈥 no entend铆 lo de la variable resultado dentro de los par茅ntesis de la funci贸n :S

let ataqueJugador 
let ataqueEnemigo
let resultadoCombate

function iniciarJuego(){
    //boton Seleccionar Mascota
    let botonMascotaJugador = document.getElementById('boton-mascota')
    botonMascotaJugador.addEventListener('click', seleccionarMascotaJugador)

    //Botones de Ataque
    let botonFuego = document.getElementById('boton-fuego')
    botonFuego.addEventListener('click', ataqueFuego)

    let botonAgua = document.getElementById('boton-agua')
    botonAgua.addEventListener('click', ataqueAgua)

    let botonTierra = document.getElementById('boton-tierra')
    botonTierra.addEventListener('click', ataqueTierra)

}

function seleccionarMascotaJugador(){
    let inputHipodoge = document.getElementById('hipodoge')
    let inputCapipepo = document.getElementById('capipepo')
    let inputRatigueya = document.getElementById('ratigueya')
    let spanMascotaJugador = document.getElementById('mascota-jugador')

    if (inputHipodoge.checked) {
        spanMascotaJugador.innerHTML = 'Hipodoge' 
    } else if (inputCapipepo.checked){
        spanMascotaJugador.innerHTML = 'Capipepo'
    } else if (inputRatigueya.checked){
        spanMascotaJugador.innerHTML = 'Ratigueya'
    } else {
        alert("Selecciona una de las mascotas disponibles")
    }

    seleccionarMascotaEnemigo()
    
}

function seleccionarMascotaEnemigo(){
    let mascotaEnemigo = aleatorio(1,3)
    let spanMascotaJugador = document.getElementById('mascota-enemigo')

    if (mascotaEnemigo == 1) {
        spanMascotaJugador.innerHTML = "Hipodoge"
    } else if (mascotaEnemigo == 2) {
        spanMascotaJugador.innerHTML = "Capipepo"
    } else {
        spanMascotaJugador.innerHTML = "Ratigueya"
    }
}

function crearMensaje() {
    let sectionMensajes = document.getElementById('mensajes')

    let parrafo = document.createElement('p')
    parrafo.innerHTML = 'Tu mascota atac贸 con ' + ataqueJugador + ', la mascota del enemigo atac贸 con ' + ataqueEnemigo + '. ' + resultadoCombate

    sectionMensajes.appendChild(parrafo)
}

function aleatorio(min, max) {
    return Math.floor(Math.random() * max - min + 1) + min
}

function ataqueFuego(){
    ataqueJugador='FUEGO'
    ataqueAleatorioEnemigo()
}

function ataqueAgua(){
    ataqueJugador='AGUA'
    ataqueAleatorioEnemigo()
}

function ataqueTierra(){
    ataqueJugador='TIERRA'
    ataqueAleatorioEnemigo()
}

function ataqueAleatorioEnemigo(){
    ataqueEnemigo = aleatorio(1,3)
// 1 es Fuego // 2 es Agua // 3 es Tierra
    if (ataqueEnemigo == 1){
        ataqueEnemigo = 'FUEGO'
    } else if (ataqueEnemigo == 2){
        ataqueEnemigo = 'AGUA'
    } else {
        ataqueEnemigo = 'TIERRA'
    }
    combate()
}

function combate(){
    if (ataqueJugador == ataqueEnemigo){
        resultadoCombate = 'EMPATE!'
    } else if(ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA' 
        || ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO' 
        || ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA') {
        resultadoCombate = 'GANASTE!'
    } else {
        resultadoCombate = 'PERDISTE!'
    }
    crearMensaje()
}


window.addEventListener('load', iniciarJuego)```

Mi logica para resolverlo fue un poco diferente, yo primero cree una variable general llamada 鈥渞esultadoCombate鈥;

let resultadoCombate 

luego cre茅 una funci贸n llamada 鈥渃ombate鈥 en la que puse todos los condicionales

function combate () {
    if (ataqueJugador == ataqueEnemigo) {
        resultadoCombate = '隆Empate!馃槕'
    } else if (ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA') {
        resultadoCombate = '隆GANASTE!馃コ'
    } else if (ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO') {
        resultadoCombate = '隆GANASTE!馃コ'
    }  else if (ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA') {
        resultadoCombate = '隆GANASTE!馃コ'
    }   else {
        resultadoCombate = '隆PERDISTE!馃槱'
    }

luego modifique el parrafo creado en la funci贸n 鈥渃rearMensaje鈥, en la parte final del parrafo para que en el innerHTML se mostrar谩 la variable 鈥淩esultadoCombate鈥

parrafo.innerHTML = 'Tu mascota uso '+ ataqueJugador + ', tu oponente uso ' + ataqueEnemigo + '- ' + resultadoCombate

y por ultimo llame a la funci贸n 鈥渃ombate鈥 justo antes de llamar a la funci贸n 鈥渃rearMensaje鈥 que esta dentro de la funci贸n 鈥渁taqueAleatorioEnemigo鈥

function ataqueAleatorioEnemigo () {
    let ataqueAleatorio = aleatorio (1,3)
    if (ataqueAleatorio == 1) {
        ataqueEnemigo = "FUEGO"
    } else if (ataqueAleatorio == 2) {
        ataqueEnemigo = "AGUA"
    }  else {
        ataqueEnemigo = "TIERRA"
    }
    combate ()
    crearMensaje ()
}

Este c贸digo es de ejemplo ya que mi juego cuenta con otras reglas, ataque y personajes, espero que les sirva para expandir ideas

para solucionar el problema de mostrar en el mensaje el resultado de la batalla declare una variable global llamada result en la cual guarde el resultado del combate y luego concatene con el mensaje a mostrar

no se si ya alguien comento de este comando, pero para cambiar la misma palabra al tiempo, puedes sombrearla y con control + D te permite seleccionar todas las palabras que necesites.

Comparto mi solucion:

let combateResultado = '';

function combate() {
    if(ataqueJugador == ataqueEnemigo) {
        combateResultado = 'Empataste!';
    } else if (ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA' || ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO' || ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA') {
        combateResultado = 'Ganaste!';
    } else {
        combateResultado = 'Perdiste!';
    }
}

estas equibocado en algo ya que en pokemon el tipo tierra es debil al agua y eficas contra el fuego y ademas en la vida real susede lo mismo, se puede apagar el fuego con la tierra y la tierra se desase cuando hay una cantidad considerable de agua.
corige eso mi bro

yo en vez de appendChild, innerHTML y createElement, he usado insertAdjacentHTML. Este m茅todo inserta y crea, a la vez, un elemento HTML. Adem谩s de que he podido a帽adir etiquetas: <br> y <strong>

//html: <section><p id="mensajes"></p></section>
function crearMensaje(resultado) {
    let elMensaje = document.getElementById("mensajes")
    
    elMensaje.insertAdjacentHTML('afterbegin', "Tu monttil atac贸 con " + ataqueJugador + ", el monttil de tu enemigo atac贸 con " + ataqueEnemigo + '<br/><strong>'  + resultado, ' </strong>')
}

yo solo quiero expresar mi humilde opinion. La TIERRA no le gana al AGUA 馃槮

yo lo resolv铆 as铆, con una variable global y funciona bien!

Yo en vez de crear un sistema de 3 vidas como el de la clase de piedra, papel y tijera, cree un sistema de puntos de vida que las mascotas van perdiendo hasta llegar a 0 y cada ataque representa una cantidad de da帽o(mas parecido al sistema de peleas de pokemon)

lo hice aplicando los conocimientos que han mostrado en las clases, estoooy 100% seguro que abra una manera de ejecutar las mismas acciones con un codigo mas limpio y compacto pero de momento desconozco cual pueda ser esa solucion, pero me siento muy contento por que desde que empezo la clase no quise simplemente copiar y pegar, quise ir tomando esos conocimientos que muestran en la clase y tratar de utilizarlos para plasmar una idea que me surgiera en la mente y siento que eso es el principio de ser progamador.

as铆 hice mi c贸digo

let resultado 
function  resultadoCombate(){
     
    if (ataqueJugador == ataqueEnemigo){
        resultado = "EMPATE"
    }else if (ataqueJugador == "FUEGO" && ataqueEnemigo == "AGUA" || ataqueJugador == "AGUA" && ataqueEnemigo == "TIERRA" || ataqueJugador == "TIERRA" && ataqueEnemigo == "FUEGO" ){
        resultado = "馃帀GANASTE"
    }else {
        resultado = "馃槩PERDISTE"
    } 
    return resultado
}

Lo que hice fue en donde se env铆a el mensaje poner las condicionales y si se gano perdi贸 o empato es una misma variable que es mostrada en mensaje, se llama win

Lo resolv铆 de esta manera:

let resultadoCombate

function ataqueAleatorioEnemigo(){
    let ataqueAleatorio = aleatorio(1, 3) 
    
    if (ataqueAleatorio == 1){
        ataqueEnemigo = "FUEGO"
    } else if(ataqueAleatorio == 2){
        ataqueEnemigo = "AGUA"
    } else { 
        ataqueEnemigo = "TIERRA"
    }

    batalla()
    crearMensaje()
}
function batalla(){
    if(ataqueJugador == ataqueEnemigo){
        resultadoCombate = "EMPATE"
    } else if(ataqueJugador == "FUEGO" && ataqueEnemigo == "TIERRA" || ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO" || ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA"){
        resultadoCombate = "GANASTE"
    } else { 
        resultadoCombate = "PERDISTE"
    }
}




function crearMensaje(){
    let sectionMensajes = document.getElementById("mensajes")// esto lo cre茅 luego que lo que est谩 abajo, para usarlo con appendchild y mostrar el mensaje el el p谩rrafo
    let parrafo = document.createElement("p")//con este elemento podemos cambiar un parrafo en html
    parrafo.innerHTML = "Tu mascota atac贸 con " + ataqueJugador + ", la mascota del enemigo atac贸 con " + ataqueEnemigo + " - " + resultadoCombate

    sectionMensajes.appendChild(parrafo)

}

me parece mejor colocar en global el (resultado de batalla) para ver el tema de las vidas.

function combate() {
        
    if(ataqueEnemigo == ataqueJugador){
        resultadoBatalla = "EMPATE"
    } else if(ataqueJugador == "Fuego" && ataqueEnemigo == "Agua"){
        resultadoBatalla = "GANASTE"
        
    } else if(ataqueJugador == "Agua" && ataqueEnemigo == "Fuego"){
        resultadoBatalla = "GANASTE"
    
    } else if(ataqueJugador == "Tierra" && ataqueEnemigo == "Agua"){
        resultadoBatalla = "GANASTE"
        
    } else {
        resultadoBatalla = "PERDISTE"
    }
    crearMensaje()
}


Este brother se rifa bien duro 隆felicidades! 馃檶馃徎

Yo cree otra funcion dentro de la funcion combate (game) para que mostrara un resultado aleatorio en caso de que el elmento que elegi se enfrente a otro elemento al cual no tengo determinado si gana o no.

function game () {
    
    function randomResult () {
        let randomResolution = random (1,2)
        if (randomResolution == 1) {
            return 'You win!'
        } else {
            return 'You lose!'
        }
    }
    if (pcMove == playerMove) {
        popUp('Draw')
    } else if (playerMove == 'WIND' && pcMove == 'WATER') {
        popUp('You win!')
    } else if (playerMove == 'WATER' && pcMove == 'FIRE') {
        popUp('You win!')
    } else if (playerMove == 'EARTH' && pcMove == 'WIND') {
        popUp('You win!')
    } else if (playerMove == 'FIRE' && pcMove == 'EARTH') {
        popUp('You win!')
    } else {
        popUp(randomResult())
    }

}

yo declare una variable global let resultadoCombate; y asigne el valor para cada caso y el mensaje se lo a帽adi por medio de la variable

Primero cree una variable global y la llame:

let resultadoAtaque

Luego cambie cada alert por esta funcion.

function combate(){
  if(ataqueEnemigo == ataqueJugador) {
    
} else if(ataqueJugador == "FUEGO" && ataqueEnemigo == "TIERRA"){
    resultadoAtaque = "GANASTE"
    crearMensaje()
    
} else if(ataqueJugador == "AGUA" && ataqueEnemigo == "FUEGO"){
  resultadoAtaque = "GANASTE"
  crearMensaje()
    
} else if(ataqueJugador == "TIERRA" && ataqueEnemigo == "AGUA"){
  resultadoAtaque = "GANASTE"
  crearMensaje()
}
  else {
    resultadoAtaque = "PERDISTE"
    crearMensaje()
}

Y la concatene en la funcion crear mensaje,

function crearMensaje(){
  let sectionMensajes = document.getElementById("mensajes")
  let parrafo = document.createElement("p")
  parrafo.innerHTML = "Tu mascota ataco con " + ataqueJugador + ", la mascota del enemigo ataco con " + ataqueEnemigo + " >>>> " + resultadoAtaque

  sectionMensajes.appendChild(parrafo)
}
 

En mi intento de resolver solo (No me funcion贸 xD), lo hice as铆:

function combate(){
        if(ataqueEnemigo == ataqueJugador){
            crearMensaje('EMPATE')
            } else if(ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA'){
            crearMensaje('GANASTE')
            } else if(ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO'){
            crearMensaje('GANASTE')
            } else if(ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA'){
            crearMensaje('GANASTE')
            } else {
            crearMensaje('PERDISTE')
                }
}


function crearMensaje(){
    let sectionMensajes = document.getElementById('mensajes')
    let parrafo = document.createElement('p')
    parrafo.innerHTML = 'Tu mascota atac贸 con ' + ataqueJugador + ' la mascota del enemigo atac贸 con '  + ataqueEnemigo +' = ' + combate
    sectionMensajes.appendChild(parrafo)```

un comando importante para cambiar todo de una sola vez en vez de hacerlo uno por uno es Ctrl + D y darle a la D las veces que necesitas cambiar y listo, borras y escribes y es mas practico.

Mi soluci贸n fue crear una variable global llamada resultadoCombate y esta variable cambiaba en la funci贸n combate() seg煤n la l贸gica, luego mandaba a llamar a funci贸n crearMensaje y le concatenaba la variable resultadoCombate

let roundResult
function combat() {

    if (playerAttack == rivalAttack) {
        roundResult = "EMPATE"
        createMessage()
    } else if (playerAttack == fire && rivalAttack == earth || playerAttack == water && rivalAttack == fire || playerAttack == earth && rivalAttack == water) {
        roundResult = "GANASTE"
        createMessage()
    } else {
        roundResult = "PERDISTE"
        createMessage()   
    }
Mi soluci贸n...

}

function createMessage() {
    let sectionMessages = document.getElementById("mensajes")

    let attacksParagraph = document.createElement("p")
    attacksParagraph.innerHTML = "T煤 mascota atac贸 con " + playerAttack + " La mascota rival atac贸 con " + rivalAttack + " ..." + roundResult

    sectionMessages.appendChild(attacksParagraph)
}

Si pero note que no para, no tiene un stop y ainque no es un loop el combate que es de 3 vidas no se detiene en 3 perdidas,

lo que hice fue crear una variable global y luego concatenarla en la funci贸n crearMensaje y me funcion贸!
La verdad que me puso muy contento poder hacerlo ya que a煤n no vi la soluci贸n del profe.
Me emocion贸 mucho porque es la primera vez que pude solucionarlo solo.

As铆 va mi c贸digo
.
.
.

let ataqueJugador;
let ataquePc;

function iniciarJuego() {

let botonMascotaJugador = document.getElementById('boton-mascotas')
botonMascotaJugador.addEventListener('click', seleccionarMascotaJugador)

let botonAtaqueFuego = document.getElementById('boton-fuego')
botonAtaqueFuego.addEventListener('click', ataqueFuego)

let botonAtaqueAgua = document.getElementById('boton-agua');
botonAtaqueAgua.addEventListener('click', ataqueAgua)

let botonAtaqueTierra = document.getElementById('boton-tierra');
botonAtaqueTierra.addEventListener('click', ataqueTierra)

}

function seleccionarMascotaJugador() {

let mascotaHipo = document.getElementById('hipodoge')
let mascotaCapi = document.getElementById('capipepo')
let mascotaRati = document.getElementById('ratigueya')
let spanMascotaJugador = document.getElementById('spanNombreMascota')
let aux1 = 0;

if (mascotaHipo.checked) {
    //alert("Seleccionaste la Mascota Hipodoge 馃悧")
    spanMascotaJugador.innerHTML = 'Hipodoge'
    aux1 = 1;

} else if (mascotaCapi.checked) {
    //alert("Seleccionaste la Mascota Capipepo 馃惁")
    spanMascotaJugador.innerHTML = 'Capipepo'
    aux1 = 2;
} else if (mascotaRati.checked) {
    //alert("Seleccionaste la Mascota Ratigueya 馃惞")
    spanMascotaJugador.innerHTML = 'Ratigueya'
    aux1 = 3
} else {
    alert("Debes seleccionar una mascota 馃悧, 馃惁 贸 馃惞")
}
seleccionarMascotaPc(aux1);
//alert("Seleccionaste la Mascota 馃憢")

}

function random(min, max) {
return Math.floor((Math.random() * (max - min + 1)) + min);
}

function seleccionarMascotaPc(aux) {
let seleccion = 0;
do {
seleccion = random(1, 3);
} while (seleccion == aux)

let spanMascotaPc = document.getElementById('spanMascotaPc')
if (seleccion == 1) {
    aux = 1;
    spanMascotaPc.innerHTML = 'Hipodoge'

} else if (seleccion == 2) {
    aux = 2;
    spanMascotaPc.innerHTML = 'Capipepo'
} else if (seleccion == 3) {
    aux = 3;
    spanMascotaPc.innerHTML = 'Ratigueya'
}

return seleccion;

}

function seleccionarAtaquePc(aux) {
let seleccion = 0;
ataquePc = 鈥溾;

seleccion = random(1, 3);

if (seleccion == 1) {
    aux = 1;
    //alert("El Pc Seleccion贸 Fuego")
    ataquePc = "Fuego"

} else if (seleccion == 2) {
    aux = 2;
    //alert("El Pc Seleccion贸 Agua")
    ataquePc = "Agua"
} else {
    aux = 3;
    //alert("El Pc Seleccion贸 Tierra")
    ataquePc = "Tierra"
}

mensajeResultado();

}

function mensajeResultado() {

let texto1 = resultado(ataqueJugador, ataquePc);

let parrafo = document.createElement('p');
parrafo.innerHTML = 'Tu mascota atac贸 con ' + ataqueJugador + ' y el PC atac贸 con ' + ataquePc + '. ' + texto1;

let seccionMensajes = document.getElementById('mensajes');
seccionMensajes.appendChild(parrafo);

}

function ataqueFuego() {
let aux = 0;

//alert("Atacas con Fuego");
ataqueJugador = "Fuego";
aux = 1;
seleccionarAtaquePc(aux);

}

function ataqueAgua() {
let aux = 0;
//alert(鈥淎tacas con Agua鈥);
ataqueJugador = 鈥淎gua鈥;
aux = 2;
seleccionarAtaquePc(aux);

}

function ataqueTierra() {
let aux = 0;
//alert(鈥淎tacas con Tierra鈥);
ataqueJugador = 鈥淭ierra鈥;
aux = 1;
seleccionarAtaquePc(aux);

}

function resultado(opcionUsuario, opcionPc) {
let pc = opcionPc;
let opcion = opcionUsuario;
let ganador = 鈥溾;

if (pc == opcion) {
    ganador = 'Empataron 馃檶馃徏';
} else if ((opcion == 'Fuego') && (pc == 'Tierra')) {
    ganador = '馃帀Ganaste 馃挭馃憦馃挜';
} else if ((opcion == 'Tierra') && ((pc == 'Agua'))) {
    ganador = '馃帀Ganaste 馃挭馃憦馃挜';
} else if ((opcion == 'Agua') && ((pc == 'Fuego'))) {
    ganador = '馃帀Ganaste 馃挭馃憦馃挜';
} else {
    ganador = 'Perdiste 馃槙馃憣馃徏';
}

return ganador;

}

window.addEventListener(鈥榣oad鈥, iniciarJuego)

Ac谩 les dejo mi aporte. Tiene algunas cositas en Ingles pero se entiende.

function combat() {

    if ((playerAttack == 'Fire' && enemysAttack == 'Earth') || (playerAttack == 'Water' && enemysAttack == 'Fire') || (playerAttack == 'Earth' && enemysAttack == 'Water')) {
        result = '隆隆隆Ganaste!!! 馃挜馃帀'
        wons++
    } else if (playerAttack == enemysAttack) {
        result = '隆Empate! 馃檲'
    } else {
        result = 'Perdiste 馃檧'
        lose++
    }
    
}

function createMessage() {
    let sectionMessages = document.getElementById('messages')
        
    let paragraph = document.createElement('p')
    paragraph.innerHTML = `Tu Pokemon atac贸 con ${playerAttack}, el Pokemon de tu enemigo ataco con ${enemysAttack} - ${result}`
    
    sectionMessages.appendChild(paragraph)
}

Yo lo hice distinto al profe Juan. Cre茅 una variable global para resultado y le cambi茅 el valor en la funci贸n combate

function combate() {
    if (ataqueEnemigo == ataqueJugador) {
        resultado = 'Empate 馃馃'
        crearMensaje()

    } else if (ataqueJugador == 'Fuego' && ataqueEnemigo == 'Tierra') {
        resultado = 'GANASTE 馃帀'
        crearMensaje()

    } else if (ataqueJugador == 'Agua' && ataqueEnemigo == 'Fuego') {
        resultado = 'GANASTE 馃帀'
        crearMensaje()

    } else if (ataqueJugador == 'Tierra' && ataqueEnemigo == 'Agua') {
        resultado = 'GANASTE 馃帀'
        crearMensaje()

    } else {
        resultado = 'Perdiste 馃槬'
        crearMensaje()
    }
}

creo que afecta si las variables no las pones con. mayusculas o minusculas, porque o pierdo siempre o empato鈥

C脫DIGO CORREGIDO.

  1. Poner atenci贸n a las 鈥溾 o 鈥樷
  2. Poner atenci贸n a invocar a las variables o funciones correctas, te puedes confundir con tanta syntaxis

interesante clase, para los que ya sabian programar, les propongo resolver o adenlantandose a la clase,haciendo el codigo antes de que el profe lo haga

Una alternativa, a concatenar todas las cadenas + cada una de las variables, seria esta:

parrafo.innerHTML = `Tu mascota ataco con ${ataqueJugador} la mascota del enemigo ataco con ${ataqueEnemigo}...${resultado}`

yo hice la respuesta con este codigo

let ataqueJugador
let ataqueEnemigo
let resultado

function iniciarJuego() {
let botonMascotaJugador = document.getElementById(鈥榖oton-mascota鈥)
botonMascotaJugador.addEventListener(鈥榗lick鈥, seleccionarMascotaJugador)

let botonFuego = document.getElementById('boton-fuego')
botonFuego.addEventListener('click', ataqueFuego)
let botonAgua = document.getElementById('boton-agua')
botonAgua.addEventListener('click', ataqueAgua)
let botonTierra = document.getElementById('boton-tierra')
botonTierra.addEventListener('click', ataqueTierra)

}

function seleccionarMascotaJugador() {
let inputHipodoge = document.getElementById(鈥榟ipodoge鈥)
let inputCapipepo = document.getElementById(鈥榗apipepo鈥)
let inputRatigueya = document.getElementById(鈥榬atigueya鈥)
let spanMascotaJugador = document.getElementById(鈥榤ascota-jugador鈥)

if (inputHipodoge.checked) {
    spanMascotaJugador.innerHTML = 'Hipodoge'
} else if (inputCapipepo.checked) {
    spanMascotaJugador.innerHTML = 'Capipepo'
} else if (inputRatigueya.checked) {
    spanMascotaJugador.innerHTML = 'Ratigueya'
} else {
    alert('Selecciona una mascota')
}

seleccionarMascotaEnemigo()

}
function combate () { if(ataqueEnemigo == ataqueJugador) {alert(鈥渁cabo en empate鈥)
resultado = " empate"}
else if(ataqueJugador == 鈥楾IERRA鈥 && ataqueEnemigo == 鈥楢GUA鈥) {alert(鈥済anaste鈥)
resultado = " ganaste"}
else if(ataqueJugador == 鈥楩UEGO鈥 && ataqueEnemigo == 鈥楾IERRA鈥) {alert(鈥済anaste鈥)
resultado = " ganaste"
}
else if(ataqueJugador ==鈥楢GUA鈥 && ataqueEnemigo == 鈥楩UEGO鈥) {alert(鈥済anaste鈥)
resultado = " ganaste"
}else
{alert(" perdiste")
resultado = " PERDISTE"}
crearMensaje()}

function seleccionarMascotaEnemigo() {
let mascotaAleatoria = aleatorio(1,3)
let spanMascotaEnemigo = document.getElementById(鈥榤ascota-enemigo鈥)

if (mascotaAleatoria == 1) {
    spanMascotaEnemigo.innerHTML = 'Hipodoge'
} else if (mascotaAleatoria == 2) {
    spanMascotaEnemigo.innerHTML = 'Capipepo'
} else {
    spanMascotaEnemigo.innerHTML = 'Ratigueya'
}

}

function ataqueFuego() {
ataqueJugador = 'FUEGO鈥
alert(ataqueJugador)
ataqueAleatorioEnemigo()
}
function ataqueAgua() {
ataqueJugador = 'AGUA鈥
alert(ataqueJugador)
ataqueAleatorioEnemigo()
}
function ataqueTierra() {
ataqueJugador = 'TIERRA鈥
alert(ataqueJugador)
ataqueAleatorioEnemigo()
}

function ataqueAleatorioEnemigo() {
let ataqueAleatorio = aleatorioo(1,3)

if (ataqueAleatorio == 1) {
    ataqueEnemigo = 'FUEGO'
} else if (ataqueAleatorio == 2) {
    ataqueEnemigo = 'AGUA'
} else {
    ataqueEnemigo = 'TIERRA'
}

combate()

}

function crearMensaje() {

let sectionMensajes = document.getElementById('mensajes')

let parrafo = document.createElement('p')
parrafo.innerHTML = 'Tu mascota ataco con ' + ataqueJugador + ', las mascota del enemigo atac贸 con ' + ataqueEnemigo + resultado
sectionMensajes.appendChild(parrafo)

}

function aleatorio(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min)
}
function aleatorioo(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min)}

window.addEventListener(鈥榣oad鈥, iniciarJuego)

Mi codigo, un poco diferente

<code> 
var ataqueJugador = 0;
var ataqueEnemigo = 0;
const rulesGame = {
   1: {
          3: true,
          2: false,
          1: false
      },     
   2: {
          1: true,
          3: false,
          2: false
      },
   3: {
          2: true,
          1: false,
          3: false
      }
}
let victorys = 0;
let defeat = 0;
var optionsGame = ["POLLO CABRON", "FUEGO","AGUA","TIERRA"];
iniciarJuego = () => 
{
   let buttonMascotas = document.getElementById("seleccionarMascota");
   buttonMascotas.addEventListener("click",seleccionMascotaJugador);
   let nodelist = document.querySelectorAll("#seleccionar-ataque button");
   let ataques = [].slice.call(nodelist);
   ataques[0].addEventListener("click", ataqueFuego);
   ataques[1].addEventListener("click", ataqueAgua);
   ataques[2].addEventListener("click", ataqueTierra);
}
seleccionMascotaJugador = (enemigo) => 
{
   // querySelectorAll genera un nodelist con todos los elementos similares 
   let nodelist = document.querySelectorAll("#seleccionar-mascota input");
   console.log(nodelist);
   var inputMascotas = [].slice.call(nodelist);
   console.log(inputMascotas)
   // Convertimos el nodelist en un array(nombresMascotas) 
   var nombresMascotas = ["Hipodoge","Capipepo","Ratigueya"];
   let spanMascotaJugador = document.getElementById("mascota-jugador");
   //forEach es el metodo de recorrer un arreglo.
   inputMascotas.forEach((valor, indice) => 
   {
      if(valor.checked) 
      {  
         spanMascotaJugador.innerHTML= ` ${nombresMascotas[indice]}`;
         enemigo == true;
       
            seleccionarMascotaEnemigo(aleatorio(0,3));
         
      }
   })
}

seleccionarMascotaEnemigo = (pc) =>
{
   var nombresMascotas = ["Hipodoge","Capipepo","Ratigueya"];
   let spanMascotaEnemigo = document.getElementById("mascota-enemigo");
   nombresMascotas.forEach((valor, indice) => 
   {
      if(indice == pc)
      {  
         spanMascotaEnemigo.innerHTML= ` ${nombresMascotas[indice]}`;
      }
   })
}

ataqueFuego = () =>
{
   ataqueJugador = 1
   ataqueEnemigo = aleatorio(1, 3);
   crearMensaje();
}
ataqueAgua = () =>
{
   ataqueJugador = 2
   ataqueEnemigo = aleatorio(1, 3);
   crearMensaje();
}
ataqueTierra = () =>
{
   ataqueJugador = 3
   ataqueEnemigo = aleatorio(1, 3);
   crearMensaje();
}
crearMensaje = () =>
{
   var sectionMensaje = document.getElementById("mensajes");
   var parrafo = document.createElement("p");
   console.log(ataqueJugador, ataqueEnemigo)
   if(rulesGame[ataqueJugador][ataqueEnemigo])
   {
      parrafo.innerHTML = "Tu mascota atac贸 con " + optionsGame[ataqueJugador] + ", las mascota del enemigo atac贸 con " +optionsGame[ataqueEnemigo] + " GANASTE";
      sectionMensaje.appendChild(parrafo);
      return victorys++
   }
   else if(ataqueJugador==ataqueEnemigo)
   {
      parrafo.innerHTML = "Tu mascota atac贸 con " + optionsGame[ataqueJugador] + ", las mascota del enemigo atac贸 con " +optionsGame[ataqueEnemigo] + " EMPATE";
      sectionMensaje.appendChild(parrafo);
   }  
   else
   {
      parrafo.innerHTML = "Tu mascota atac贸 con " + optionsGame[ataqueJugador] + ", las mascota del enemigo atac贸 con " +optionsGame[ataqueEnemigo] + " PERDISTE";
      sectionMensaje.appendChild(parrafo);
      return defeat++
   }
   estadisticas();
}

aleatorio = (min, max) =>
{
   return Math.floor(Math.random() * (max - min + 1) + min);
}

estadisticas =() =>
{
   while(victorys == 3 || defeat == 3)   
   {
      alert("GANASTE " + victorys +" PERDISTE " + defeat);
      victorys = 0;
      defeat = 0;
   }
}

window.addEventListener("load", iniciarJuego)

me siento un poco perdida con algunas cosas pero intentare teener paciencia

function combate (lo que esta dentro de estos par茅ntesis es un par谩metro)

los par谩metros sirven mucho para directamente incluir toda la informaci贸n del resultado en forma de una variable y as铆 hacerlo din谩mico.

Lo resolv铆 declarando variable general = resultado, y luego en vez de alerta poniendo esa variable resultado = perdiste o ganaste o empate en el combate!

En el mensaje al final coloqu茅 + resultado鈥 y funciono!

Yo cree una variable Global resultadoJuego donde almacenes el valor del combate para luego imprimirlo con la funcion mostrarMensaje.

Leyendo los comentarios, veo que fue la soluci貌n que se nos ocurrio a la mayoria 馃槃

Gracias Juan DC

Me da gusto el aprender javascript, pero sobre todo, me da mas gusto mejorar mi logica al analizar mejor mi codigo y poder emplearlo en diferentes aspectos en mi vida.

Yo pense usar la variable resultado como global, para llenar la variable cuando haya un combate con el resultado y asi utilizar la variable en la concatenaci贸n al final, dio el mismo resultado

Para mi todo es nuevo鈥 pero continua hacia la meta鈥 Que buen profe

El mensaje oculto de esta clase seria, si puedes re utilizar una l贸gica que hayas desarrollado previamente, do it.

hay que aprender a utilizar bibliotecas.

Por fin logr茅 que me arrojaran los resultados de los combates jeje ![](

let ataqueJugador
let ataqueEnemigo

function iniciarJuego() {
    let botonMascotaJugador = document.getElementById('boton-mascotas')
    botonMascotaJugador.addEventListener('click', seleccionarMascotaJugador)

    let botonFuego = document.getElementById('boton-fuego')
    botonFuego.addEventListener('click',ataqueFuego)
    let botonAgua = document.getElementById('boton-agua')
    botonAgua.addEventListener('click', ataqueAgua)
    let botonTierra = document.getElementById('boton-tierra')
    botonTierra.addEventListener('click', ataqueTierra)
}

function seleccionarMascotaJugador(){
    let inputHipodoge = document.getElementById('hipodoge')
    let inputCapipepo = document.getElementById('capipepo')
    let inputRatigueya = document.getElementById('ratigueya')
    let spanMascotaJugador = document.getElementById('mascota-jugador')

    if (inputHipodoge.checked) {
        spanMascotaJugador.innerHTML = 'Hipodoge'
    } else if (inputCapipepo.checked) {
        spanMascotaJugador.innerHTML = 'Capipepo'
    } else if (inputRatigueya.checked) {
        spanMascotaJugador.innerHTML = 'Ratigueya'
    } else {
        alert('Selecciona una mascota 馃樅')
    }

    seleccionarMascotaEnemigo()
}

function seleccionarMascotaEnemigo() {
    let mascotaAleatoria = aleatorio(1,3)
    let spanMascotaEnemigo = document.getElementById('mascota-enemigo')

    if (mascotaAleatoria == 1){
        spanMascotaEnemigo.innerHTML = 'Hipodoge'
    } else if (mascotaAleatoria == 2){
        spanMascotaEnemigo.innerHTML = 'Capipepo'
    } else {
        spanMascotaEnemigo.innerHTML = 'Ratigueya'
    }
}

function ataqueFuego() { 
    ataqueJugador = 'FUEGO'
    ataqueAleatorioEnemigo()
    //alert('Ataque Fuego')
}

function ataqueAgua() { 
    ataqueJugador = 'AGUA'
    ataqueAleatorioEnemigo()
    //alert('Ataque Agua')
}

function ataqueTierra() { 
    ataqueJugador = 'TIERRA'
    ataqueAleatorioEnemigo()
    //alert('Ataque Tierra')
}

function ataqueAleatorioEnemigo() {
    let ataqueAliatorio = aleatorio(1, 3)

    if (ataqueAliatorio == 1) {
        ataqueEnemigo = 'FUEGO'
    } else if (ataqueAliatorio == 2) {
        ataqueEnemigo = 'AGUA'
    } else {
        ataqueEnemigo = 'TIERRA'
    }

    combate()
}

function combate(){
    if(ataqueEnemigo==ataqueJugador){
        crearMensaje("EMPATE")
    } else if(ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA'){
        crearMensaje("GANASTE")
        
    } else if(ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO') {
        crearMensaje("GANASTE")
        
    } else if(ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA') {
        crearMensaje("GANASTE")
        
    } else {
        crearMensaje("PERDISTE")
    }
}

function crearMensaje(resultado){
    let sectionMensajes = document.getElementById('mensajes')

    let parrafo = document.createElement('p')
    parrafo.innerHTML = 'Tu mascota atac贸 con '+ ataqueJugador +', las mascota del enemigo atac贸 con ' + ataqueEnemigo + '- '+ resultado +' 馃帀馃帀'

    sectionMensajes.appendChild(parrafo)
}

function aleatorio(min, max){
    return Math.floor( Math.random() * (max - min + 1) + min)
}

window.addEventListener('load', iniciarJuego)

Esta clase estuvo muy buena.

PENSE EN UNA VARIABLE GLOBAL :V

en el combate con un .or. || puedes juntar los tres GANASTE en uno solo y compactar mas la funci贸n

Mi soluci贸n fue la siguiente:
Cre茅 la variable global resultado, la concateno en el final del mensaje que se crea en la funci贸n crearMensaje, y en la funci贸n combate al final de cada cada condici贸n le asigno a resultado el valor que le corresponde, y cuando termina el condicional llamo a la funci贸n crearMensaje, la cual imprimir谩 el mensaje con el resultado que se qued贸 almacenado.
Adem谩s simplifiqu茅 un poco el condicional, con el operador OR ( || )

let resultado;

function combate(){
    if(ataqueEnemigo == ataqueJugador){
        resultado = 'EMPATE'
    } else if(ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA' || ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO' || ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA'){
        resultado = 'GANASTE'
    } else {
        resultado = 'PERDISTE'
    }

    crearMensaje();
}

function crearMensaje(){
    let seccionMensajes = document.getElementById('mensajes');


    let parrafo = document.createElement('p')
    parrafo.innerHTML = 'Tu mascota atac贸 con ' + ataqueJugador + ',' + ' Tu enemigo us贸 ' + ataqueEnemigo + '. ' + resultado + '.';

    seccionMensajes.appendChild(parrafo);
}
function estado() {
    let estadoActual = '';
    if (ataqueJugador == ataqueEnemigo) {
        estadoActual = 'EMPATE '
    } else if((ataqueJugador == 'AGUA') && (ataqueEnemigo == 'FUEGO')) {
        estadoActual = 'GANASTE';
    } else if ((ataqueJugador == 'FUEGO') && (ataqueEnemigo == 'TIERRA')) {
        estadoActual = 'GANASTE';
    } else if ((ataqueJugador == 'TIERRA') && (ataqueEnemigo == 'AGUA')) {
        estadoActual = 'GANASTE';
    } else {
        estadoActual = 'PERDISTE'
    }
    return estadoActual
}

function crearMensaje() {
    let sectionMensajes = document.getElementById('mensajes');

    let parrafo = document.createElement('p');
    parrafo.innerHTML = 'Tu masconta ataco con ' + ataqueJugador + ' , la mascota del enemigo con ' + ataqueEnemigo + ' -> ' + estado();

    sectionMensajes.appendChild(parrafo);
}

Aqui esta mi c贸digo

B谩sicamente todos mis cambios se basan en recorrer un array de los ataques y mascotas en vez de usar tanto if, as铆 si agrego m谩s mascotas o ataques no tengo que modificar el codigo

Tambien para que lo copien y peguen mas f谩cil

const botonMascotaJugador = document.getElementById('boton-mascota')
const botonAtaqueFuego = document.getElementById('boton-ataque-fuego')
const botonAtaqueAgua = document.getElementById('boton-ataque-agua')
const botonAtaqueTierra = document.getElementById('boton-ataque-tierra')

const mascotas = ['hipodoge', 'capipepo', 'ratigueya']
const ataques = ['FUEGO', 'AGUA', 'TIERRA']

let ataqueJugador
let ataqueEnemigo
let resultado

function aleatorio(min, max) {
  return Math.floor(Math.random() * (max - min + 1) + min)
}

function seleccionarMascotaEnemigo() {
  const spanMascotaEnemigo = document.getElementById('mascota-enemigo')

  let mascotaAleatoria = aleatorio(0, mascotas.length - 1)
  let nombreMascotaAleatoria = mascotas[mascotaAleatoria]
  // let index = 1
  // for (let mascota of mascotas) {
  //   if (mascotaAleatoria == index) {
  //     nombreMascotaAleatoria = mascota
  //   }
  //   index++
  // }

  spanMascotaEnemigo.innerHTML = nombreMascotaAleatoria
}

function seleccionarMascotaJugador() {
  const spanMascotaJugador = document.getElementById('mascota-jugador')
  let mascotaSeleccionada

  for (let mascota of mascotas) {
    const isCheckedMascotoa = document.getElementById(mascota).checked
    if(isCheckedMascotoa) {
      mascotaSeleccionada = mascota
    }
  }

  if (mascotaSeleccionada) {
    spanMascotaJugador.innerHTML = mascotaSeleccionada
    seleccionarMascotaEnemigo()
  } else {
    alert('Selecciona una mascota para comenzar')
  }
}

function seleccionarAtaqueEnemigo() {
  const ataqueAleatorio = aleatorio(0, ataques.length - 1)
  ataqueEnemigo = ataques[ataqueAleatorio]
}

function mostrarMensaje(resultadoCombate) {
  const contenedorMensajes = document.getElementById('mensajes')
  let parrafo = document.createElement('p')
  let mensaje = document.createTextNode(`Tu mascota ataccon ${ataqueJugador}, las mascota del enemigo ataccon ${ataqueEnemigo} - ${resultadoCombate}`)

  parrafo.appendChild(mensaje)
  contenedorMensajes.appendChild(parrafo)
}

function combate() {
  if (ataqueJugador == ataqueEnemigo) {
    mostrarMensaje('EMPATE')
  } else if(ataqueJugador == 'FUEGO' && ataqueEnemigo == 'TIERRA') {
    mostrarMensaje('GANASTE')
  } else if (ataqueJugador == 'AGUA' && ataqueEnemigo == 'FUEGO') {
    mostrarMensaje('GANASTE')
  } else if (ataqueJugador == 'TIERRA' && ataqueEnemigo == 'AGUA') {
    mostrarMensaje('GANASTE')
  } else {
    mostrarMensaje('PERDISTE')
  }
}

function seleccionarAtaqueJugador(e) {
  const ataque = e.target.innerText
  let ataqueFormateado = ataque.slice(0, ataque.length - 3).toUpperCase()

  for (let ataque of ataques) {
    if (ataqueFormateado == ataque) {
      ataqueJugador = ataqueFormateado
    }
  }

  if(ataqueJugador) {
    seleccionarAtaqueEnemigo()
    combate()
  } else {
    alert('Selecciona un ataque v谩lido')
  }
}

botonAtaqueFuego.addEventListener('click', seleccionarAtaqueJugador)
botonAtaqueAgua.addEventListener('click', seleccionarAtaqueJugador)
botonAtaqueTierra.addEventListener('click', seleccionarAtaqueJugador)
botonMascotaJugador.addEventListener('click', seleccionarMascotaJugador)

Como yo lo resolvi

//Arrays con ataques y animales enemigos
var enemigos = ["enemyAanimal1", "enemyAnimal2", "enemyAnimal3"]
var ataquesEnemigos = ["Fuego", "Tierra", "Agua"]

//Inicio del juego
window.addEventListener("load", iniciarJuego);
function iniciarJuego(){
    let botonMascota = document.getElementById("botonSeleccionar")
    botonMascota.addEventListener("click", selectionPet)

    let botonFuegoJs = document.getElementById("botonFuego")
    botonFuegoJs.addEventListener("click", ataqueFuego)

    let botonAguaJs = document.getElementById("botonAgua")
    botonAguaJs.addEventListener("click", ataqueAgua)

    let botonTierraJs = document.getElementById("botonTierra")
    botonTierraJs.addEventListener("click", ataqueTierra)

}
//Eleccion de Mascota
function selectionPet(){
    let random = Math.floor(Math.random() * enemigos.length)
    let randomEnemy = enemigos[random];

    if (document.getElementById("animal1").checked){
        document.getElementById("namePet").innerHTML = "animal1"
        document.getElementById("enemyNamePet").innerHTML = randomEnemy
    }
    else if (document.getElementById("animal2").checked){
        document.getElementById("namePet").innerHTML = "animal2"
        document.getElementById("enemyNamePet").innerHTML = randomEnemy 
    }
    else if (document.getElementById("animal3").checked){
        document.getElementById("namePet").innerHTML = "animal3"
        document.getElementById("enemyNamePet").innerHTML = randomEnemy 
    }
    else {
        alert("Slecciona una mascota")
    }
    
}
//Ataques del juagor
function ataqueFuego(){
    randomAtack("Fuego")
}
function ataqueAgua(){
    randomAtack("Agua")

}
function ataqueTierra(){
    randomAtack("Tierra")

}
//Ataques aleatorios enemigos
function randomAtack (jugador)
{
    let ataqueRandom = Math.floor(Math.random() * ataquesEnemigos.length)
    let ataqueResultado = ataquesEnemigos[ataqueRandom];
    let resultado;
//Resultado de la pelea

if (jugador == ataqueResultado){
    resultado = "EMPATE";
}
else if (jugador == "Agua" && ataqueResultado == "Fuego" || jugador == "Fuego" && ataqueResultado == "Tierra" || jugador == "Tierra" && ataqueResultado == "Agua"){
    resultado = "Ganaste";
}
else {
    resultado = "Perdiste";
}    


//imprimir mensaje enemigo y del jugador
    let parrafo = document.createElement("p")
    parrafo.innerHTML="Tu mascota ataco con " + jugador + " la mascota del enemido ataco con " + ataqueResultado + " - " + resultado;
   
    let newSection = document.getElementById("mensajes");
    newSection.appendChild(parrafo)
}

Algo en la logica no me anda, siempre con uno nunca pierdo con otro nunca empato y con otro nunca gano