-1

Нужно получить див с изображением и именем по определённому id

let characterWrap = document.querySelector('#characters-wrap')

const url = 'https://rickandmortyapi.com/api/character/'
async function getCards(url) {
   try {
      const response = await fetch(url);
      return await response.json();

   } catch (e) {
      console.error(`Something is bad ---> ${e}`);
   }
}

getCards(url)
   .then(({ results }) => {
      results

         .map(({ id, name, status, image }) => {
            const indetifier = Promise

            results.forEach(({ id }) => {
               const uCardOfCharthers = document.createElement('div')

               image = document.createElement('img')
               image.src = results
               uCardOfCharthers.appendChild(image)

               characterWrap.appendChild(uCardOfCharthers)
               uCardOfCharthers.innerHTML =
                  `<img src='${image}' </img>
                  
                   ${name}
                  
                   ${status}`
            })
            const uCardOfCharthers = document.createElement('div')
            characterWrap.appendChild(uCardOfCharthers)
            uCardOfCharthers.innerHTML =
               `${image}
            
             ${name}
            
             ${status}`
         })
   })
`

6
  • А в чем вопрос?
    – Evgenii
    20 мая 2022 в 13:07
  • Пожалуйста, уточните вашу конкретную проблему или приведите более подробную информацию о том, что именно вам нужно. В текущем виде сложно понять, что именно вы спрашиваете. 20 мая 2022 в 13:08
  • Нужно получить див с изображением из api. Вопрос в том что не знаю как это сделать
    – user497202
    20 мая 2022 в 13:18
  • Оооо) Я на этом АПИ делал тестовое задание на React-е))
    – EzioMercer
    20 мая 2022 в 13:30
  • Что именно не получается? Какие ошибки в данном коде?
    – EzioMercer
    20 мая 2022 в 13:32

1 ответ 1

0

Мне кажется, что вы случайно написали лишние интерации и действия, там где они не нужны. Перебирается массив с результатами и потом еще раз внутри этого перебора перебираются результаты уже деструктурируя только id. Как минимум это не есть хорошо. + вы переопределяете url картинки вот этой строкой image = document.createElement('img')

let characterWrap = document.querySelector('#characters-wrap')

const url = 'https://rickandmortyapi.com/api/character/'
async function getCards(url) {
   try {
      const response = await fetch(url);
      return await response.json();

   } catch (e) {
      console.error(`Something is bad ---> ${e}`);
   }
}

getCards(url)
   .then(({ results }) => {
      results
         .map(({ id, name, status, image }) => {
               const uCardOfCharthers = document.createElement('div')
               characterWrap.appendChild(uCardOfCharthers)

               uCardOfCharthers.innerHTML =
                   `<img src='${image}' </img>
                    ${name}
                    ${status}`
         })
   })
<div id="characters-wrap" />

2
  • спасибо большое)
    – user497202
    20 мая 2022 в 14:05
  • object HTMLImageElement и означает, что у вас в src лежит объект типа HTMLImageElement (т.е. тег img)
    – Evgenii
    20 мая 2022 в 14:09

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.