javascript - 将多个文件转换为 HTML(来自 Markdown)？

Question

我目前正在做一个小项目，我想在其中将几个(或更多)Markdown 文件转换为 HTML，然后将它们附加到主文档中。我希望所有这一切都发生在客户端。我选择了几个插件，例如 Showdown (Markdown 到 HTML 转换器)、jQuery(整体 DOM 操作)和 Underscore(必要时用于简单模板)。我被困在无法将文件转换为 HTML(转换为其中包含 HTML 的字符串)的地方。

将 Markdown 转换为 HTML 非常简单:

var converter = new Showdown.converter();
converter.makeHtml('#hello markdown!');

我不确定如何将文件提取(下载)到代码(字符串？)中。

如何从 URL(该 URL 是 Markdown 文件)获取文件，将其传递给 Showdown，然后获取 HTML 字符串？ 顺便说一句，我只使用 JavaScript。

Answer 1

您可以获取外部文件并使用ajax 将其解析为字符串。 jQuery 方式更简洁，但普通的 JS 版本可能看起来像这样:

var mdFile = new XMLHttpRequest();
mdFile.open("GET", "http://mypath/myFile.md", true);
mdFile.onreadystatechange = function(){
 // Makes sure the document exists and is ready to parse.
 if (mdFile.readyState === 4 && mdFile.status === 200)   
 {
    var mdText = mdFile.responseText; 
    var converter = new showdown.Converter();
    converter.makeHtml(mdText);
    //Do whatever you want to do with the HTML text
 }
}

jQuery 方法:

$.ajax({
  url: "info.md",
  context: document.body,
  success: function(mdText){
    //where text will be the text returned by the ajax call
    var converter = new showdown.Converter();
    var htmlText = converter.makeHtml(mdText);
    $(".outputDiv").append(htmlText); //append this to a div with class outputDiv
  }
});

注意:这假定您要解析的文件在您自己的服务器上。如果文件在客户端(IE 用户文件)，则需要采用不同的方法

更新

如果您需要的文件与您在同一台服务器上，上述方法将有效。如果不是，那么如果您控制远程服务器，则必须查看 CORS，如果不这样做，则必须查看服务器端解决方案。 This question提供了一些有关跨域请求的相关背景。