js加载Markdown文件并解析

原因

因为之前的项目都将.md文件放到了GitHub或者Coding上，这两个平台会有自动解析md文件的能力，但是最近突发奇想，想把这个Wiki也同步显示到我自己的后台上，于是搞了搞JS解析和PHP自动加载

框架及使用到的插件

Marked.js 解析MarkDown
CDN地址：http://www.bootcdn.cn/marked/

highlight.js 语法高亮(只需src目录就可以)
地址：https://github.com/isagalaev/highlight.js

ThinkPHP框架

Bootstrap3.0

使用详情

引用 mark.js highlight.js default.css

以自己的路径为准

引用js

有多种样式，请自行引用

引用css

实例化代码

<script>
        hljs.initHighlightingOnLoad(); #实例化高亮
        $(document).ready(function(){
            $("#content").html(marked({$html})); #此处的$html代指json数据，详情看后面
        })
</script>

加载文件

PHP代码

protected $wikiMenu = "./Wiki/"; //错误日志所在目录

public function indexAction(){
        $markdown = file_get_contents($this->wikiMenu."README.md"); #读取指定目录下的README.md文件
        $markdown = json_encode($markdown,JSON_UNESCAPED_UNICODE|JSON_PRETTY_PRINT); #将获取到的内容转化成JSON
        $this->assign("html",$markdown); #传到前台
        $this->display();
}

public function _empty(){
        $markdown = file_get_contents($this->wikiMenu.ACTION_NAME.".md");
        $markdown = json_encode($markdown,JSON_UNESCAPED_UNICODE|JSON_PRETTY_PRINT);
        $this->assign("html",$markdown);
        $this->display("Doc/index");
}

示例图 效果图

这里遇到个问题，TABLE并没有被转换掉，修改方法如下：

marked.js 第825行
为table添加一个class="table table-hover"

修改图

最终效果图：

最终效果图