将 JS 功能添加到 nodejs express 应用程序（幻灯片）答案

【问题标题】：Add JS functionalities to a nodejs express app (slideshow)将 JS 功能添加到 nodejs express 应用程序（幻灯片）
【发布时间】：2020-06-25 00:25:45
【问题描述】：

我是 nodejs 的新手，我正在做一个里程碑项目。我正在使用 NodeJS、Express 和 MongoDB。我有普通的 JS 代码，用于检索虚拟数据并通过 DOM 操作 HTML。我知道我不能通过 express 应用程序使用 DOM。我从哪里开始用 express 做同样的事情？我想从 mongoDB 中检索数据，当我单击我的 html 上的按钮时，检索 post[i].title 和 post[i].content

function currentPost(n) {

    post1= '<div class="blogPost"><a href="post1.html"><h3 class="resize">
Post 1</h3></a><p class="resize">    "Lorem ipsum dolor"</p></div>';    

if (n == 0) {
    document.getElementById("containerBlogPost").innerHTML = post1;    
}
else if (n == 1){
    document.getElementById("containerBlogPost").innerHTML = post2;    

}
else if (n == 2){
    document.getElementById("containerBlogPost").innerHTML = post3;    

}
else if (n == 3){
    document.getElementById("containerBlogPost").innerHTML = post4;    

}
}

在一个事件中，我使用该数据通过 DOM 上传我的 html。我不需要荒谬的细节，但我需要指导。我整天都在为此苦苦挣扎。

【问题讨论】：

您应该查看fetch。使用它从您的服务器中提取数据

标签： node.js mongodb express

【解决方案1】：

在您的客户端 JavaScript 中，您需要向 Express 服务器发送数据请求。最简单的方法是使按钮成为表单的一部分，并让表单向服务器发送 GET 请求。 Express 服务器将有一个路由来处理查询数据库的 GET 请求，并将响应从数据库发送到客户端。然后，客户端 JavaScript 将从响应中挑选出数据，您可以使用数据填充元素的 innerHTML。

为了做到这一点，另一个需要查找的有用的东西是回调，这样您的客户端代码就不会在来自服务器的响应进入之前填充页面。

从 MDN here 了解有关使用表单发送数据的更多信息。详细了解 Express 路线处理here。

【讨论】：