Apa yang saya mahu lakukan ialah menerima beberapa gambar menggunakan API NASA. Foto-foto ini kemudiannya dipaparkan pada lakaran kecil halaman saya dan paparan utama.

Saya baru tahu sebab kod tidak mendapat imej daripada lakaran kecil dan memaparkannya pada halaman. Saya juga menggunakan tapak web templat dalam HTML5 dan ke atas. Saya tidak begitu biasa dengan kod itu. Sebarang bantuan amatlah dihargai.

Jadi, cara tapak kelihatan berfungsi ialah ia memerlukan imej src dan nilai tag href untuk memaparkannya dalam lakaran kecil dan paparan utama. Saya menggunakan permintaan pengambilan untuk mendapatkan maklumat API NASA. Saya kemudian menggunakan kaedah data.map untuk menulis ganti kod HTML dan memasukkan HTML saya sendiri.

Idea saya ialah jika saya menulis ganti HTML sebelumnya dengan HTML dalam permintaan get, ia akan berfungsi dengan baik. tetapi ia bukanlah kebenaran.

Turut dilampirkan pautan ulangan untuk melihat keseluruhan tapak dalam masa nyata: https://replit.com/@jamesYamez/nasa-api#nasa-api-site/index.html

Saya rasa kesilapan utama ialah

Uncaught TypeError: newSlide tidak ditakrifkan

fetch(url)
    .then(req => req.json())
    .then((data)=> {
        //using map to assign the data values to the html
    let html = data.map(item => `
        <article>
                        <a class="thumbnail" href="${item.hdurl}" data-position="left center"      target="_blank"><img src="${item.url}" alt="..." /></a>
            <h2>${item.title}</h2>
            <p>${item.explanation}</p>
        </article>
        `)
        thumbnails.innerHTML = html.join("")
    })
    .catch((e) => console.error(e))