let preguntas = [{ pregunta: "¿Con qué propiedad se pone el color de fondo en CSS?", correcta: "backgroundColor", incorrecta1: "color", incorrecta2: "bckColor", incorrecta3: "setColor" }, { pregunta: "¿tipo de letra en CSS?", correcta: "font-family", incorrecta1: "fontaine", incorrecta2: "letter", incorrecta3: "pp" }, { pregunta: "¿ocultar elemento en CSS?", correcta: "display:none", incorrecta1: "display:hide", incorrecta2: "shadow", incorrecta3: "esconding" }]; // Al pulsar un botón se desencadena la acción // ¿Se capturar el click de un botón? let boton = document.getElementById("boton"); // Clásica /* boton.onclick=function(){ console.log("click"); } */ // Moderna y normalmente ahora es la preferida porque permite añadir más capturas boton.addEventListener("click", function () { // puntos que valdrán 0 let puntos = 0; // Recorrer el array de las preguntas for (let pregunta of preguntas) { // Para cada pregunta // Mostrar un prompt con el texto de la pregunta y las respuestas desordenadas // La pregunta-> Acceder a la propiedad del objeto // respuestas-> saber como desordenar una serie de respuestas // Guardar las respuestas en un array y desordenarlo let respuestas = [pregunta.correcta, pregunta.incorrecta1, pregunta.incorrecta2, pregunta.incorrecta3]; // Desordeno el array respuestas.sort(() => .5 - Math.random()); // De un array sacar una cadena es muy fácil: recorrerlo y añadir la posición +1 // Creo la cadena juntando las respuestas. Le pongo un número a cada respuesta let cadena = ""; for (let i = 0; i < respuestas.length; i++) { cadena += (i + 1) + ") " + respuestas[i] + " - "; } // Lo mismo usando map y join cadena = respuestas.map((valor, indice) => (indice + 1) + ") " + valor).join(" - "); let respuesta = Number(prompt(pregunta.pregunta + "\n" + cadena)); // Cuando el usuario me de la respuesta // Comprobar si es correcta: coger la posición del usuario -1 y ver el valor console.log(respuestas[respuesta - 1]); // Si ese valor==correcta muy bien y puntos++ else muy mal if (respuestas[respuesta - 1] == pregunta.correcta) { alert("Muy bien"); puntos++; } else { alert("Muy mal, looser"); } } // Al acabar de recorrer le mostramos los puntos alert("Has sacado " + puntos+ " puntos"); });