您的位置：首页 > Web前端 > JavaScript

js解析markdown文件（Markdown.Converter.js)

2015-10-15 23:42 627 查看

要实现的功能是用js来解析后台传来的md文件，我采用的是使用pagedown的Markdown.Converter.js文件来完成解析操作

思路如下：

准备一个简单的html页面

一个向后台请求md文件的js

后台接收请求并返回md文件的路由（语言是python）

步骤：

简单的html页面：

<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://cdn.bootcss.com/pagedown/1.0/Markdown.Converter.js"></script>
</head>
<body>
<div id="test"></div>
<script type="text/javascript" src='./test.js'></script>
</body>
</html>

在上面的这个html页面，其实主要就引入了Markdown.Converter.js这个文件，至于jquery因为我后边儿的请求要用到，所以这里也一并引入。

向后台请求的js（test.js)：

$(document).ready(function(){
$.ajax({
url: '/test',
type: 'POST',
dataType: 'json',
success:function(data){
var converter = new Markdown.Converter();
var htm = converter.makeHtml(data);
$('#test').html(htm);
}
});
});

这个js我设定的是在页面载入完成便自动向后台请求md文件，然后在将返回的md数据解析

并嵌入到对应的元素中

后台实例：

@app.route('/test', methods=['GET', 'POST'])
def test():
if request.method == 'POST':
filename = 'test.md'
file = codecs.open(filename, mode='r', encoding='utf8')
text = file.read()
return json.dumps(text)

这里也就只写了个大概的片段，具体一些模块还得引入哟！反正这后台做的事情就是读取md文件，然后将这个文件打包成json返回给请求的js

小结

现在看看其实js解析md文件直接引用那个markdown.converter.js就可以很方便的解决了,当然我也知道这只是这个js最最简单的一个用法，还有很多的功能待探索。作为菜鸟的我，弄这个东东也是弄了很久很久～才弄出来，期间找到了个strapdown.js，也是挺好用的只需要直接引入，然后在这对标签

<xmp></xmp>

中输入md格式的文件，便可以自动的转换出来，可是它集成了一些样式在里边儿不是我需要的，看了下不知道怎么改便放弃了…（嘿嘿，能力有限～）。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： python markdown js PageDown

相关文章推荐

新的分享

章节导航