Я пытаюсь добавить способ оставить комментарий для каждого блога, который я создаю. Мой мыслительный процесс заключался в том, чтобы обернуть мои postTitle и postContent в div. Затем передайте HTML форму js commentForm, которая имеет доступ ко всем идентификаторам блога.
Проблема в том, что blogCard.appendChild (postTitle, postContent) на самом деле не обертывает атрибуты в div и renderCommentForm () возвращают строку во внешний интерфейс вместо HTML.
Спасибо за любой совет, который вы можете предложить, чтобы выяснить, как создать комментарий для каждого сообщения в блоге через forEach.
const postContainer = document.querySelector("#posts-container")
console.log(posts)
posts.data.forEach(function(post){
const newPostTitle = document.createElement('h4')
newPostTitle.innerText = post.attributes.title
const postTitle = postContainer.appendChild(newPostTitle)
const newPostContent = document.createElement('p')
newPostContent.innerText = post.attributes.content
const postContent = postContainer.appendChild(newPostContent)
const button = document.createElement('button')
button.id= `${post.id}`
button.innerText = 'Leave a Comment'
postContainer.appendChild(button)
const blogPostCard = document.createElement('div')
const newBlog = blogPostCard.appendChild(postTitle, postContent)
postContainer.appendChild(newBlog)
const commentForm = document.createElement('div')
commentForm.innerText = renderCommentForm(button.id)
postContainer.appendChild(commentForm)
button.addEventListener('click', function(e){
renderCommentForm(button.id)
});
function renderCommentForm(postId){
console.log(postId)
return (
`<form id='comment-form' class="">
<input id='comment' type="text" name='comment' value='' placeholder= 'Comment Here'/>
</form>`)
}