1

我目前正在做一个小项目，我想将几​​个（或更多）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。

4

2 回答 2

4

您可以获取一个外部文件并使用 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，如果不控制，则必须研究服务器端解决方案。 这个问题提供了有关跨域请求的一些相关背景。

于 2013-03-09T14:56:51.330 回答
0

一旦你有了 HTML 字符串，你可以通过简单地调用来追加到任何你想要的 DOM 元素：

var myElement = document.getElementById('myElement');
myElement.innerHTML += markdownHTML;

...markdownHTML 是从 makeHTML 返回的 html。

于 2013-03-09T15:02:00.167 回答