1const hash = "my hash";
2const apikey = "public api key";
3const url = `https://gateway.marvel.com:443/v1/public/characters?nameStartsWith=iron%20man&ts=1&apikey=${apikey}&hash=${hash}`;
4
5const STATUS_OK = 200;
6const STATUS_CREATED = 201;
7const STATUS_NOT_FOUND = 404;
8
9const draw = (data) => {
10  const container = document.createElement("div");
11  data.forEach((characterFromComic) => {
12    const characterHTML = `
13        <div>
14            <h2>${characterFromComic.name}</h2>
15            <img src="${characterFromComic.thumbnail.path}/portrait_incredible.${characterFromComic.thumbnail.extension}" alt="${characterFromComic.name}">
16        </div>`;
17
18    container.insertAdjacentHTML("beforeend", characterHTML);
19  });
20  myContent.appendChild(container);
21};
22
23async function loadComics() {
24  const response = await fetch(url);
25  switch ( response.status ) {
26    case STATUS_OK:
27      const characters = await response.json();
28      draw( characters.data.results );
29      break
30    case STATUS_NOT_FOUND:
31      console.log('No se encontro informacion');
32      break
33  }
34}
35
36btn.addEventListener('click', loadComics);