Question

trying to create a div element after form is submitted to store input on next page must be able to create a new div for every post and render them, it only works when appended to body, i need it in the main

我尝试过多个谷歌修正, 并问一个朋友谁代码的标语

document.addEventListener( DOMContentLoaded , function() {
    var formData = JSON.parse(localStorage.getItem( formData ));

    if (formData) {
        var blogPostDiv = document.createElement( div );
        blogPostDiv.classList.add( blog-post );

        var usernamePara = document.createElement( p );
        usernamePara.textContent =  Author:   + formData.username;

        var titlePara = document.createElement( h2 );
        titlePara.textContent = formData.title;

        var contentPara = document.createElement( p );
        contentPara.textContent = formData.content;

        blogPostDiv.appendChild(usernamePara);
        blogPostDiv.appendChild(titlePara);
        blogPostDiv.appendChild(contentPara);
        
        // Append the div to the body or another desired location
        document.main.appendChild(blogPostDiv); 
    } else {
        // Handle case where data is not found in localStorage
        console.log( No blog post data found. );

    }
});

Answer 1

如果您在谈论元素 , 您需要从文档( DOM) 中获取元素, 才能在文档中附加任何内容 :

const mainElement = document.querySelector( main ) // Or document.getElementsByTagName( main )[0]
mainElement.appendChild(blogPostDiv);

main 不是一个有效的文档 obj (默认) 属性

<强>Docs:

Answer 2

You need to specify the element to add blogPostData. Please try this document.getElementById("your other id").appendChild(blogPostDiv);

友情链接