为自己的网站添加Markdown——showdown.js使用教程

学习地址：https://www.jianshu.com/p/747d6f8dddb0
练习代码地址：https://github.com/956159241/DemoOfWebFront

步骤1.下载showdown.js

步骤2引入到自己的项目中，结构如下:

步骤3，引入到html，并使用

使用showdown.js的基本方式：

function compile(){

    //获取要转换的文字
    var text = document.getElementById("content").value;
    //创建实例
    var converter = new showdown.Converter();
    //进行转换
    var html = converter.makeHtml(text);
    //展示到对应的地方  result便是id名称
 document.getElementById("result").innerHTML = html;
}

仿的markdown实例代码：

运行结果：

之后又发现一个开源库：
https://github.com/chjj/marked
使用方式相对简单一些，参照上面的实例，完成相同的功能，如下：
实例代码：

暂时先看这两个开源库，目前都不能像一样对照片进行操作，待了解~