将多个文件转换为HTML(来自Markdown)?

raf*_*raf 1 html javascript markdown

我目前正在开发一个小项目,我希望将几个(或更多)Markdown文件转换为HTML,然后将它们附加到主文档中.我希望所有这些都发生在客户端.我选择了几个插件,如Showdown(Markdown到HTML转换器),jQuery(整体DOM操作)和Underscore(如果需要,可以进行简单的模板化).我陷入困境,似乎无法将文件转换为HTML(转换为包含HTML的字符串).

将Markdown转换为HTML很简单:

var converter = new Showdown.converter();
converter.makeHtml('#hello markdown!');
Run Code Online (Sandbox Code Playgroud)

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

如何从URL获取文件(该URL是Markdown文件),通过Showdown传递,然后获取HTML字符串?我只是使用JavaScript.

Ben*_*ick 5

您可以获取外部文件并使用ajax将其解析为字符串.jQuery方式更简洁,但是一个vanilla 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
 }
}
Run Code Online (Sandbox Code Playgroud)

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
  }
});
Run Code Online (Sandbox Code Playgroud)

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

更新

如果您需要的文件与您在同一台服务器上,则上述方法将起作用.如果它们不是那么你必须在控制远程服务器时查看CORS,如果不控制则需要服务器端解决方案. 此问题提供了有关跨域请求的一些相关背景.