Как в document.querySelector вставить html?

Question

[Chesterfield25]

Если я пишу код так то получаю синтаксическую ошибку из за кавычек в html коде. Если я весь html код беру в кавычки ` ` то получаю ошибку

main.js:5 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'forEach')

async function getPosts() {
    let res = await fetch('https://jsonplaceholder.typicode.com/posts');
    let posts = await res.json();

    posts.array.forEach(post => {
        document.querySelector('.post-list').innerHTML += 
`        <div class="card" style="...">
            <div class="card-body">
                <h5 class="card-title">${post.title}</h5>
                <p class="card-text">${post.body}</p>
                <a href="#" class="card-link">Подробнее</a>
            </div>
        </div>`
        
        
    });
}
getPosts();

Answer 1

[Сергей delphinpro]

document.querySelector('.post-list').innerHTML += `
        <div class="card" style="...">
            <div class="card-body">
                <h5 class="card-title">${post.title}</h5>
                <p class="card-text">${post.body}</p>
                <a href="#" class="card-link">Подробнее</a>
            </div>
        </div>`

posts.array.forEach

Ошибка, потому что в posts нет элемента array

Comments

[Chesterfield25]

Получаю ошибку которую я написал выше!

[Chesterfield25]

Это подставка кода в vsCode

Answer 2

[Григорий]

Напишите, что получаете в posts
console.log(posts)