markdown转html(使用Markdown.Converter)
程序员文章站
2022-07-14 11:34:38
...
我这里就写个简单静态的案例吧，
大家可通过后台读取markdown文件内容传到前端进行转换，
这里我就不写后端了
首先我们需要引入两个js文件，jquery跟Markdown.Converter，
jquery引入一定要在前面。
在id为demo1的textarea便签中输入需要转换的markdown格式内容，然后点击按钮来进行转换，代码如下：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>mdToHTMLDemo</title>
<script src="jquery.min.js"></script>
<script src="Markdown.Converter.js"></script>
</head>
<body>
<!--输入需要转换的内容框开始-->
<h1>转换前</h1>
<textarea id="demo1" style="width:800px;height:300px;">
hadoop命令需在hadoop目录下使用
**常用命令**
HDFS格式化:
bin/hadoop namenode -format 格式化namenode
bin/hadoop datanode -format 格式化datanode
*如不是第一次格式化，为了保证clusterID一致性,
*需先删除hdfs临时目录,
*即在配置文件中配置的hadoop.tmp.dir参数路径
</textarea>
<!--输入需要转换的内容框结束-->
<!--点击该按钮进行转换-->
<button onclick="mdToHml();" type="button">转Html</button>
<p>================= 华丽丽的分割线 ====================</p>
<h1>转换后</h1>
<!--展示转换后的内容开始-->
<div id="test">我是空的</div>
<!--展示转换后的内容结束-->
<!--js开始-->
<script type="text/javascript">
//转换的方法
function mdToHml(){
var md=$("#demo1").val();//得到需要转换的内容
var converter = new Markdown.Converter();
var htm = converter.makeHtml(md);//转换
$('#test').html(htm);//显示到页面
}
</script>
<!--js结束-->
</body>
</html>效果如下：
这里转换有点缺陷(可以看我另一篇文章,介绍了另一种转换),
如下图：
上一篇： Markdown 速查手册
下一篇： OpenCV中的图像金字塔