差不多了，基本上在使用appendChild（）方法时需要传递一个节点。
创建一个div节点，

// create an element node
// var text = document.createTextNode(userComment);
var text = document.createElement('div');
text.innerText = userComment;

把它传到新评论区，

// note: you need to pass a node to appendChild() method
// newComment.appendChild(userComment);
newComment.appendChild(text);

希望能有所帮助!
一个一个二个一个一个一个三个一个一个一个一个一个四个一个

您应该将newComment.appendChild(userComment)更改为newComment.appendChild(text);。现在，我添加了一些小的更新，如在发送评论后清除文本区域，并将评论添加到段落中，以防止在同一行中显示不同的已发送评论：

var post= document.getElementById("post");
post.addEventListener("click",function(e){
    e.preventDefault();

    var userComment=document.getElementById("comment-box").value;
    
    var text= document.createElement('p');;
    text.innerHTML = userComment;

    var newComment = document.getElementById("new-comment");

    newComment.appendChild(text);
    document.getElementById("comment-box").value = "";
   
})

.comment-box,
  .post-comment .list{
    background-color: white;
    border-radius: 5px;
    box-shadow: 0 2px 2px black;
  }

.comment-section{
  width: 100%;
  height: auto;
  margin: 0 auto;
}

.post-comment .list{
  width: 100%;
  margin-bottom: 12px;
}

.post-comment .list .user{
  display: flex;
  padding: 8px;
  overflow: hidden;
}

.post-comment .list .user img{
  height: 38px;
  width: 38px;
  margin-right: 10px;
  border-radius: 50%;  
}

.comment-section .name{
  text-transform: uppercase;
}

.post-comment .list .day{
  font-size: 12px;
}

.post-comment{
  padding: 0 0 15px 58px
}



#comment-box{
  border:none;
  border-radius: 5px;
}

.comment-box .user{
  display: flex;
  width: min-content;
}

.comment-box .image img{
  width:24px;
  height: 24px;
  margin-right: 10px;
  border-radius: 50%;
}

.comment-box textarea{
  height: 50px;
  width: 1 ;
  background-color: white;
  margin: 10px 0;
  padding: 10px;
  border-radius: 5px;
  box-shadow: 0 0 0 1px black;
}

<div class="post-comment">
          <div class="list">
            <div class="user">
              <div class="user-image"><img src="./images/ok.webp"></div>
              <div class="user-name">
                <div class="name">TOM</div>
                <div class="day">100 days ago</div>
              </div>
            </div>
            <div class="comment">LOREM IPSUN DABUN VUB</div>
          </div>
          <div id="new-comment"></div>

          <div class="comment-box">
            <div class="user">
              <div class="user-image"><img src="./images/OK.webp"></div>
              <form>
              <textarea name="comment" placeholder="YOUR MESSAGE" id="comment-box"></textarea>
              <button id="post">Comment</button>
            </form>
          </div>

        </div>
      </div>
     </div>