0

Buen@s a todos,

Podria alguien darme solucion a este ejercicio por favor ? Soy autodidacta y no tengo profe que me corrija

    <script>
    const $body = document.querySelector("body");
    const $div = document.createElement("div");

    $body.appendChild($div);
    
    const TECNOLOGIAS = [{url: 'reactjs.org',name: 'ReactJS'},{url: 'nodejs.org',name: 'NodeJS'}{url: 'graphql.org',name: 'GraphQL'}];   

  TECNOLOGIAS.forEach (params => {
    const $img = document.createElement("img");
      img.src = `https:/logo.clearbit.com/${params.url}`;
    const $span = document.createElement("span");
    const $spanText = document.createTextNode(`${params.name}`);

  })
    $div.appendChild($img);
    $div.appendChild($span);
    $span.appendChild($spanText);

Pretendo crear a partir de Javascript los div con lo paramentros indicados sin pasar por HTML. Me parece haber creado bien la etiqueta Div dentro del body, y con el forEach he recorrido los elementos del array. Al final añado al Dic las img con su "url" y la etiqueta span con el texto "name". La pantalla está en blanco, no hace caso a mi script. Gracias por la ayuda.

1
  • Intenta ver si en la consola del navegador no te aparece algún error.
    – hilliyo
    Commented el 6 nov. 2022 a las 17:24

2 respuestas 2

2

había varios errores.

  1. Referenciabas mal la variable, te faltaba $ y tenías mal la URL:
  const $img = document.createElement("img");
  $img.src = `https://logo.clearbit.com/${params.url}`;
  1. Creabas las variables en el ciclo pero los usabas fuera, no se encontraban en el mismo ámbito:
TECNOLOGIAS.forEach (params => {
  const $img = document.createElement("img");
  $img.src = `https://logo.clearbit.com/${params.url}`;
  const $span = document.createElement("span");
  const $spanText = document.createTextNode(`${params.name}`);
  $div.appendChild($img);
  $div.appendChild($span);
  $span.appendChild($spanText);
  })
2

Tiene varios errores de compilación y uno de programación

  1. const TECNOLOGIAS le falta una coma separadora entre urls

  2. img.src es con el $ delante

  3. los appendChild van dentro del bucle foreach

Eso a simple vista.

const TECNOLOGIAS = [{url: 'reactjs.org',name: 'ReactJS'},{url: 'nodejs.org',name: 'NodeJS'},{url: 'graphql.org',name: 'GraphQL'}];   

 $div = document.body.appendChild(document.createElement("div"));

introducir el código aquí

Tu Respuesta

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

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