javascript - 从另一个页面抓取 HTML

Question

我有两个 HTML 文件:一个充当模板，提供导航、侧边栏等，另一个包含主要内容。我正在尝试找出如何最好地将内容插入到模板中。我需要持久的 URL，因此我的计划是让内容页面本质上用模板替换自身，将文本插入到结果页面中。我对前端编程真的很陌生，我怀疑这可能是一种反模式，所以我的第一个问题是我是否在寻找正确的树。这个问题似乎很普遍，我确信一定有一个最佳实践，尽管我还没有看到它的讨论。如果这是一种可接受的继续方式，那么什么 JavaScript 函数允许我同时访问两个不同页面的 HTML？

[编辑:这是 GitHub 上的一个小页面]

Answer 1

不要这样做。目前的实现 HTML 并未设计为模板引擎。您可以使用HTML import但浏览器尚未完全支持。 (compatibility table)。

通常这个问题可以通过以下方式解决:

• 使用前端框架。像 angular.js 或polymer.js(和 so on )这样的库通常支持导入不同形式的 HTML 文档。

• 构建您的应用程序 HTML。通常像 grunt.js 这样的任务运行器 has plugin其中包括 HTML。

• 使用服务器端技术从基本布局扩展 HTML

如果您的应用程序必须由不同的 HTML 组成，我建议您尝试 polymer 。它是用于 Web 组件的 Polyfill，并且默认设计为以这种方式工作。

更新:

关于编辑您的问题。看起来你只需要 HTML 模板引擎。你可以用谷歌搜索一下。我用nunjucks - python 模板引擎 jinja2 的 javascript 端口。它轻量、简单并且可以直接在浏览器中编译。

另一种方法是使用专门的工具来构建静态网页。您已经提到您的页面是由简单的 HTML 页面构建的博客。尝试使用pelican 。它是静态网站(博客)生成器。它简单又快速。您甚至可以在本地计算机上构建 HTML，然后将 HTML 页面推送到 github。