1

Resulta que tengo este código, el cual me recorre un array de una API. Al imprimir en el HTML me repite algunas de las plataformas ya que estas pueden ser por ejemplo: PlayStation 1, PlayStation 2, etc. Quisiera que solo me apareciera un logo sin importar la plataforma, me explico: si es ps2 y ps3 solo quiero que me salga un logo para esos dos.

 for (let i = 0; i < platforms.length; i++) {
        const listaplataformas = document.createElement('img');
        listaplataformas.classList.add('plataformas__li');
        if (textoPlataformas[i].platform.name === 'PC') {
            listaplataformas.src = 'img/windows.png'
        }else if(textoPlataformas[i].platform.name.includes('PlayStation')){
            listaplataformas.src = 'img/ps.png';
        }else if(textoPlataformas[i].platform.name.includes('Android')){
            listaplataformas.src = 'img/android.png'
        }else if(textoPlataformas[i].platform.name.includes('Xbox')){
            listaplataformas.src = 'img/xbox.png'
        }else if (textoPlataformas[i].platform.name.includes('Wii')){
            listaplataformas.src = 'img/wii.png'
        }else if (textoPlataformas[i].platform.name.includes('Nintendo')){
            listaplataformas.src = 'img/nintendo.png'
        }else {
            listaplataformas.remove()
        }
        plataformas.appendChild(listaplataformas);        
    }

introducir la descripción de la imagen aquí

2
  • 2
    Es mucho pero mucho mas facil tener un array con todas las plataformas, asociadas a un booleano, y que esten todas apagadas por defecto.. y solo vas prendido a medida que las encontras.. si varios nombres son de la misma, pues se prendera una sola vez...
    – gbianchi
    el 27 mar. a las 23:12
  • es que esa info viene de la API el 28 mar. a las 0:29

1 respuesta 1

2
let bpc = true, bps = true, ban = true,
    bxb = true, bwi = true, bni = true;
for ( let i = 0; i < platforms.length; i++ ) {
    const listaplataformas = document.createElement('img');
    listaplataformas.classList.add('plataformas__li');
    if (textoPlataformas[i].platform.name === 'PC' && bpc ) {
        listaplataformas.src = 'img/windows.png'
        bpc = false;
    }else if(textoPlataformas[i].platform.name.includes('PlayStation') && bps ){
        listaplataformas.src = 'img/ps.png';
        bps = false;
    }else if(textoPlataformas[i].platform.name.includes('Android') && ban ){
        listaplataformas.src = 'img/android.png'
        ban = false;
    }else if(textoPlataformas[i].platform.name.includes('Xbox') && bxb ){
        listaplataformas.src = 'img/xbox.png'
        bxb = false;
    }else if (textoPlataformas[i].platform.name.includes('Wii') && bwi ){
        listaplataformas.src = 'img/wii.png'
        bwi = false;
    }else if (textoPlataformas[i].platform.name.includes('Nintendo') && bni ){
        listaplataformas.src = 'img/nintendo.png'
        bni = false;
    }else {
        listaplataformas.remove()
    }
    plataformas.appendChild(listaplataformas);        
}

Solo necesitas agregar unos booleanos, para verificar si una imagen ya está cargada.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.