把文章写入到html显示,在网页中使用markdown编辑文章，并通过html在网页中进行显示...

在网页中可以通过textarea这个控件进行文本编辑，但是这个方式有点呆，而且不好看。现在记录文章用得比较多的是markdown，那么在自己的网站中集成一个markdown进行文章的记录是一件比较爽的事，而且可以不需要搞很多添加效果的按钮，比如像分段、分行、插入代码这些功能通过markdown语法就可以进行实现了

第一步

下载开源库：

第二步

将showdown.js这个文件导入文件的根目录中

第三步

在要使用markdown的页面中引入showdown.js文件中的showdown.min.js文件

第四步

定义一个方法：获取markdown中的内容，将内容进行转化，将转化后的内容显示在指定位置

function compile() {

// 获取想要转换的文字

var text = document.getElementById("content").value;

// 创建实例

var converter = new showdown.Converter();

// 进行转换

var html = converter.makeHtml(text);

// 将内容显示到指定的地方

document.getElementById("result").innerHTML = html;

}

全部实现代码如下

Title

var text = document.getElementById("content").value;//创建实例

var converter = newshowdown.Converter();//进行转换

var html =converter.makeHtml(text);//将内容显示到指定的地方

document.getElementById("result").innerHTML =html;

}

/*自定义代码显示效果*/code {

color: #D34B62;

background: #fdffbd;

}

#wrap{

margin: auto;

overflow: hidden;

}

#mark{

width:40%;

height: 800px;float: left;

}

#result{

width:40%;

height: 800px;float: left;

background-color: #27bbff;

}

实现效果

原文：https://www.cnblogs.com/lyd447113735/p/11874557.html