Question

背景

我想停止使用Latex为我的应用程序创建文档和自动报告，我希望使用html+css我可能稍后使用wkhtml2pdf转换为pdf允许添加封面页，内容表，页眉，页脚，所有这些都在A4分隔页中。

wkhtml2pdf是轻量级exe，支持脚本/ css，用于高级文档预处理/格式化。所以，到目前为止，一切都很好，似乎html+css是替换Latex的最佳选择......

问题

为了便于维护而不是将所有文档内容放在一个文件中，我最初想要组织我的本地文件：

doc/index.html

docs/includes/introduction.html
docs/includes/part1.html
docs/includes/part2.html

docs/resources/mystyle.css
docs/resources/jquery-3.1.1.min.js

并编写主要文档index.html，如下所示：

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="mystyle.css">
    <script src="./resources/jquery-3.1.1.min.js"></script>

    <script>
      // When document is ready, feed divs with real content
      $(document).ready(function() 
      {     
        $('#Introduction').load('./resources/introduction.html');
        $('#Part1').load('./resources/part1.html');
        $('#Part2').load('./resources/part2.html');         
      });       
    </script>
  </head>

  <body>
    <div id="Introduction"></div>
    <div id="Part1"></div>
    <div id="Part2"></div>  
  </body>
</html>

不幸的是，这样做，我收到XMLHttpRequest错误，基本上告诉它无法加载文件，因为cross-origin仅支持http，数据，Chrome，https等...协议（ ??即使我的所有文件都是本地文件，main.html也是从本地文件系统启动的 - 所有相同的来源 - ??）。

我尝试了许多解决方法（link rel=import，w3IncludeHTML，使用iframe并尝试阅读内容）这些解决方案都属于cross-origin问题。

问题

是否有简单/轻松解决方案来合并本地 main.html文件中的所有本地 html片段（即无外部{ {1}}或额外的工具，只是基本的html + javascript）？

NB1：我知道我可以在Chrome浏览器中更改标记以允许grep，但我想避免这种情况。首先，出于安全原因。其次，因为在向cross-origin转换器发送文件时我无法做到这一点。第三，因为要提供文档并并且说＆＃34;并不是很容易;只需点击wkhtml2pdf即可在网络浏览器中打开文档＆＃34;。

NB2：文档片段很可能只是index.html，<section>，<p>，<img>元素全部合并在<table>的主体中，用于管理css - 在一个地方格式化和其他东西。

Answer 1

您可以使用span在Firefox中获取本地文件。

它过去常常与Chrome配合使用，但安全性很高。自2010年以来对本地文件的限制has been introduced。

也许您可以向所有客户推荐使用Firefox ......

解决方法（适用于Chrome）可以将资源加载为div，并以多行字符串形式获取内容。

在 index.html ：

XMLHttpRequest

在 ressource1.js ：

<script>

资源保存在单独的文件中（以JavaScript的形式）并注入主HTML文档。

也许值得提供一个Electron应用程序以及您的文档文件，以便在没有Web服务器的情况下浏览它。

实际上它是一个装有chromuim浏览器的node.js网络服务器。它针对大多数平台，你只需要你的HTML / JS / CSS技能。顺便说一下，你也可以在里面集成一个PDF库。

在本地html主容器

1 个答案: