如何使用 JavaScript 将 HTML 转换为 RTF答案

【问题标题】：How to convert HTML to RTF using JavaScript如何使用 JavaScript 将 HTML 转换为 RTF
【发布时间】：2015-03-27 11:27:09
【问题描述】：

我有一个带有页眉和页脚的输入 HTML 文件。它需要转换为 RTF。 HTML 的页眉/页脚应在生成的 RTF 文件中重复。

是否有任何插件可以仅使用 JavaScript 将 HTML 转换为 RTF？？

【问题讨论】：

标签： javascript html plugins rtf

【解决方案1】：

您可以使用this converter

但它不涉及项目符号（ul、li 元素）

function convertHtmlToRtf(html) {
  if (!(typeof html === "string" && html)) {
      return null;
  }

  var tmpRichText, hasHyperlinks;
  var richText = html;

  // Singleton tags
  richText = richText.replace(/<(?:hr)(?:\s+[^>]*)?\s*[\/]?>/ig, "{\\pard \\brdrb \\brdrs \\brdrw10 \\brsp20 \\par}\n{\\pard\\par}\n");
  richText = richText.replace(/<(?:br)(?:\s+[^>]*)?\s*[\/]?>/ig, "{\\pard\\par}\n");

  // Empty tags
  richText = richText.replace(/<(?:p|div|section|article)(?:\s+[^>]*)?\s*[\/]>/ig, "{\\pard\\par}\n");
  richText = richText.replace(/<(?:[^>]+)\/>/g, "");

  // Hyperlinks
  richText = richText.replace(
      /<a(?:\s+[^>]*)?(?:\s+href=(["'])(?:javascript:void\(0?\);?|#|return false;?|void\(0?\);?|)\1)(?:\s+[^>]*)?>/ig,
      "{{{\n");
  tmpRichText = richText;
  richText = richText.replace(
      /<a(?:\s+[^>]*)?(?:\s+href=(["'])(.+)\1)(?:\s+[^>]*)?>/ig,
      "{\\field{\\*\\fldinst{HYPERLINK\n \"$2\"\n}}{\\fldrslt{\\ul\\cf1\n");
  hasHyperlinks = richText !== tmpRichText;
  richText = richText.replace(/<a(?:\s+[^>]*)?>/ig, "{{{\n");
  richText = richText.replace(/<\/a(?:\s+[^>]*)?>/ig, "\n}}}");

  // Start tags
  richText = richText.replace(/<(?:b|strong)(?:\s+[^>]*)?>/ig, "{\\b\n");
  richText = richText.replace(/<(?:i|em)(?:\s+[^>]*)?>/ig, "{\\i\n");
  richText = richText.replace(/<(?:u|ins)(?:\s+[^>]*)?>/ig, "{\\ul\n");
  richText = richText.replace(/<(?:strike|del)(?:\s+[^>]*)?>/ig, "{\\strike\n");
  richText = richText.replace(/<sup(?:\s+[^>]*)?>/ig, "{\\super\n");
  richText = richText.replace(/<sub(?:\s+[^>]*)?>/ig, "{\\sub\n");
  richText = richText.replace(/<(?:p|div|section|article)(?:\s+[^>]*)?>/ig, "{\\pard\n");

  // End tags
  richText = richText.replace(/<\/(?:p|div|section|article)(?:\s+[^>]*)?>/ig, "\n\\par}\n");
  richText = richText.replace(/<\/(?:b|strong|i|em|u|ins|strike|del|sup|sub)(?:\s+[^>]*)?>/ig, "\n}");

  // Strip any other remaining HTML tags [but leave their contents]
  richText = richText.replace(/<(?:[^>]+)>/g, "");

  // Prefix and suffix the rich text with the necessary syntax
  richText =
      "{\\rtf1\\ansi\n" + (hasHyperlinks ? "{\\colortbl\n;\n\\red0\\green0\\blue255;\n}\n" : "") + richText +  "\n}";

  return richText;
}

【讨论】：

【解决方案2】：

经过一番搜索，我找到了一个可行的解决方案：

https://www.npmjs.com/package/html-to-rtf

使用html-to-rtf，转换很容易（这是一段基于browserify的代码）：

var htmlToRtf = require('html-to-rtf');
var htmlText = "<div>...</div>"; //or whatever html you want to transform
var htmlAsRtf = htmlToRtf.convertHtmlToRtf(htmlText); // html transformed to rtf

这个解决方案对我有用。如果没有 browserify，您将不得不在带有 npm 的下载模块中找到隐含的 js 并将它们链接到您的 html 页面。

【讨论】：

【解决方案3】：

我应用了@Samra 解决方案，效果很好。但后来我在输出中发现了一个错误：一些文本被截断了。经过大量调查，这似乎是关于 HTML cmets () 没有得到正确处理。我的解决方案是将此richText 转换添加为第一个：

// Delete HTML comments
richText = richText.replace(/<!--[\s\S]*?-->/ig,"");

【讨论】：

【解决方案4】：

根据Francisco Valles answer，我创建了一个捆绑包以轻松将其包含在您的网络项目中：

https://github.com/geraphl/javascript-html-to-rtf-browser

<script src="~/js/html-to-rtf-browser.min.js"></script>

然后你可以通过添加将html转换为microsofts rtf格式

var htmlToRtfLocal = new window.htmlToRtf();
var rtfContent = htmlToRtfLocal.convertHtmlToRtf(htmlContent);

给你的javascript。

【讨论】：