DHTML Ya

pagina.html
estilos.css
funciones.js
Ejecución de la página

function proximaBandera() {
    const paises = []
    let cant = 0
    do {
        let aleatorio = Math.trunc(Math.random() * 250)
        if (!paises.includes(aleatorio)) {
            paises.push(aleatorio)
            cant++
        }
    } while (cant < 4);
    let correcta = Math.trunc(Math.random() * 4)
    let pos = paises[correcta]
    let pregunta = `<img src="${datos[pos].flags.png}">`
    const d = document.querySelector("#contenedor")
    d.innerHTML = pregunta

pregunta = `
            <input class="boton" type="button" value="${datos[paises[0]].name.common}" id="b1">
            <input class="boton" type="button" value="${datos[paises[1]].name.common}" id="b2">
            <input class="boton" type="button" value="${datos[paises[2]].name.common}" id="b3">
            <input class="boton" type="button" value="${datos[paises[3]].name.common}" id="b4">
        `
    const b = document.querySelector("#botones")
    b.innerHTML = pregunta
    for (let f = 1; f <= 4; f++)
        document.querySelector(`#b${f}`).addEventListener('click', evt => {
            if (correcta == `${f - 1}`)
                correctas++
                else {
                    incorrectas++
                    alert(`Es la bandera de ${datos[paises[correcta]].name.common}`)
                }
            actualizarResultados()
        })
}

function actualizarResultados() {
    document.querySelector("#resultados").innerHTML = `
        <p>Correctas: ${correctas}</p>
        <p>Incorrectas: ${incorrectas}</p>`
    proximaBandera()
}

let correctas = 0
let incorrectas = 0
let datos = null
fetch("https://restcountries.com/v3.1/all")
    .then(response => response.json())
    .then(bande => {
        datos = bande
        actualizarResultados()
    })

57 - Desafío 4: Examen múltiple opciones con banderas del mundo

Retornar