Markdown（editormd）语法解析成html

时间：2021-08-04 13:37:22

　　我们在一些网站中可以见到一款网页编辑器——markdown；

　　这是一款功能强大的富文本编辑器，之前自己在网页上使用的时候遇到了一点点的问题，现在跟大家分享下

　　在我们写了文章之后是需要将内容保存到数据库的，如果保存到数据库中要方便以后需改的话，那么需要保存成markdown语言，如果保存成html语言通过反向解析成markdown这个可能效果不是很好

　　如果保存成markdown就涉及到将数据库中的数据取出后要解析成html，以下便是我的解决过程（我使用的是editormd）：

　　

　　首先需要初始化从markdown语言转为html语言的解析器：
　　 
editormd.markdownToHTML("test-editormd", {

    htmlDecode      : "style,script,iframe",

    emoji           : true,

    taskList        : true,

    tex             : true,  // 默认不解析

    flowChart       : true,  // 默认不解析

    sequenceDiagram : true  // 默认不解析

});
　　其次就是js的引入，以下的js可以去editormd页面下载 ，地址：https://pandao.github.io/editor.md
　　 
<script src="./examples/js/jquery.min.js"></script>

<script src="lib/marked.min.js"></script>

<script src="lib/prettify.min.js"></script>

<script src="lib/raphael.min.js"></script>

<script src="lib/underscore.min.js"></script>

<script src="lib/sequence-diagram.min.js"></script>

<script src="lib/flowchart.min.js"></script>

<script src="lib/jquery.flowchart.min.js"></script>

<script src="./editormd.js"></script>
　　引入的顺序不能出错否则可能有些js对象不能初始化，这些js在editor.md的lib包中已经存在。
 
　　还有就是上方中的"test-editormd",其实是html代码中的一个id，这个是存放md内容的
　　<div id="test-editormd">

　　　　<textarea style="display:none;" placeholder="markdown语言">#Editor.md</textarea>

    </div>
　　至此，已经完成了所有的步骤，这可以使得数据库中的md数据在页面解析显示，#Editor.md是放置markdown语言的地方

 

　　

相关文章