Markdown(editormd)语法解析成HTML
2017-09-13 22:19
495 查看
我们在一些网站中可以见到一款网页编辑器——markdown;
这是一款功能强大的富文本编辑器,之前自己在网页上使用的时候遇到了一点点的问题,现在跟大家分享下
在我们写了文章之后是需要将内容保存到数据库的,如果保存到数据库中要方便以后需改的话,那么需要保存成markdown语言,如果保存成html语言通过反向解析成markdown这个可能效果不是很好
如果保存成markdown就涉及到将数据库中的数据取出后要解析成html,以下便是我的解决过程(我使用的是editormd):
首先需要初始化从markdown语言转为html语言的解析器:
其次就是js的引入,以下的js可以去editormd页面下载 ,地址:https://pandao.github.io/editor.md
引入的顺序不能出错否则可能有些js对象不能初始化,这些js在editor.md的lib包中已经存在。
还有就是上方中的"test-editormd",其实是html代码中的一个id,这个是存放md内容的
至此,已经完成了所有的步骤,这可以使得数据库中的md数据在页面解析显示,#Editor.md是放置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语言的地方
相关文章推荐
- Markdown(editormd)语法解析成html
- Markdown(editormd)语法解析成html
- markdown转HTML(使用editor.md)
- 前端--三种插件用来解析mardowm,转化成为html语法
- .md即markdown文件的基本常用编写语法(图文并茂)
- editor.md国产markdown编辑器使用实例
- SpringBoot+Editormd实现markdown文本编辑和图片上传
- Markdown语法转为html语法
- Gitbook Editor编辑器中使用markdown语法总结
- Wiz.Editor.md 为知笔记 Markdown 插件
- markdown(editor.md)编辑器-图片上传
- HTML table标签,css样式,caption标签,标题及摘要的语法解析
- C#自写的一个HTML解析类(类似XElement语法)
- GitHub中的Markdown MD文件 语法
- wxParse 0.3 微信小程序 HTML/Markdown 富文本解析, 支持多级及 Emoji
- WP Editor.MD:一个好用的Markdown WP插件
- 常用Markdown(MD)语法
- 快速入门 Editor.MD---在Web项目里使用 Markdown 编辑器
- 【asp】【markdown】md语法基础
- Markdown编辑器editor.md的使用---markdown上传图片