如何为本地网站制作文本数据库？

Question

我正在为商业软件做一个类似网站的帮助部分。为此，该网站将实际安装在本地沿着软件，而不是在服务器上，因此我不能使用服务器工具来制作一个数据库。我使用的是javascript、jquery和CSS (没有SQL或PHP)。

为了使重复的文本部分易于修改，我需要某种形式的文本数据库，我可以手动修改，也可以通过javascript/jquery逐页修改。

例如:假设特定软件属性的相同文本描述显示在5个不同的页面中，甚至在同一页面上多次显示。这种类型的描述稍后将由软件开发人员适当地修改，他们将从页面访问它(使用弹出文本输入)，并且该修改必须应用于该属性的整个网站。

我怎么才能让这种事情成为可能呢？

同样，请记住，此网站将存储在本地磁盘上。

Answer 1

您需要一个JavaScript模板引擎。第一个也是最好的一个是Handlebars.js。您可以使用它来创建布局一次，并将布局应用于您拥有的所有数据，这样，您就可以分离数据和表示。

假设这是项目的基本布局：

<div class="entry">
  <h1>{{title}}</h1>
  <div class="body">
    {{body}}
  </div>
</div>

如果您有多个项目，则可以使用JSON作为提要：

[
  {
    title: "My Post 1",
    body: "This is my first post!"
  },
  {
    title: "My Old Post",
    body: "This is my first post!"
  },
  {
    title: "My Latest Post",
    body: "This is my first post!"
  },
  {
    title: "My New Post",
    body: "This is my first post!"
  }
]

你可以将相同的布局应用于所有的四个帖子！上面的代码在客户端执行，如下所示：

<div class="entry">
  <h1>My Post 1</h1>
  <div class="body">
    This is my first post!
  </div>
</div>
<div class="entry">
  <h1>My Old Post</h1>
  <div class="body">
    This is my first post!
  </div>
</div>
<div class="entry">
  <h1>My Latest Post</h1>
  <div class="body">
    This is my first post!
  </div>
</div>
<div class="entry">
  <h1>My New Post</h1>
  <div class="body">
    This is my first post!
  </div>
</div>

有关执行、编译模板的更多信息，请查看docs。