NodeJS：从对象动态创建html

Question

我正在使用一个 API，我在其中以 NodeJS 中的对象形式获取内容。这个对象有一个标题、文本和几个表格。现在我想遍历这个对象，用它创建 HTML 并将它传递给我的数据库。在基本的 JS 中，我会简单地遍历 objects 元素并使用“document.createElement(..)”一一创建 HTML 元素。但是，我发现 NodeJS 中没有“文档”。

所以我想知道是否有类似的方法可以做到这一点？我看到了只使用字符串的选项，例如：var elem = '<div>' + text + '</div>';。但是，我想知道是否还有其他更漂亮的选项来处理这个问题。

Answer 1

jsdom有解决办法

jsdom 是许多 Web 标准的纯 JavaScript 实现， 尤其是用于 Node.js 的 WHATWG DOM 和 HTML 标准。在 一般来说，该项目的目标是模拟足够多的 网络浏览器可用于测试和抓取真实世界的网络 应用程序。

Answer 2

我有一个解决方案。使用这种方法，我会忽略数据库，因为您有很多方法可以从那里更新/检索数据。

您可以使用 ejs 更新您在“html”文件中呈现的数据。

值得注意的是，在早期我也使用 express 来为我的前端提供服务，如果您由于某种原因无法使用此解决方案，那么此解决方案将不适合您。

Html 在这里用引号引起来，因为使用 ejs 的第一步是复制您的 html 文件并将其放在名为“views”的文件夹中（这是 ejs 默认查找文件的文件夹）然后您将文件重命名为“ .ejs" 并在需要动态数据的任何位置添加占位符。

例如，您的“index.html”文件变为“index.ejs”，现在放置在新创建的顶级文件夹“views”中。

占位符如下所示：

<%= YourVariableNameHere &?> 

然后在你的js文件中，你需要在app.express();减速之后在下面添加这一行

app.set('view engine' ,ejs');

然后在您的app.get("/", req,res) => {... 中添加以下行：

res.render('index.ejs', {YourVariableNameHere :"Placeholder Default Message"});

这将在您的页面首次打开时呈现您的默认消息。现在，在您的 app.post 方法中，您可以在确定要显示的内容后重新使用 res.render，并使用它来更新和动态更改前端显示的内容。

您可以构建用于显示的字符串或将字符串变量传递到“占位符默认消息”。还值得注意的是，html 和换行符 "\n" 也可以在此处传递，但要使其在浏览器中正确呈现，您需要将 style="white-space: pre; text-align: center;" 添加为 css 或标签。