效果
实现代码
<!DOCTYPE html>
<html>
<head>
<title>MarkDown</title>
</head>
<style>
body {
font-family: "Helvetica Neue", Helvetica, Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif;
font-size: 16px;
line-height: 1.42857143;
color: #333;
background-color: #fff;
}
ul li {
line-height: 24px;
}
blockquote {
border-left:#eee solid 5px;
padding-left:20px;
}
code {
color:red;
background: gray;
}
</style>
<body>
<div>
<textarea id="content" style="height:200px;width:200px;" onkeyup="compile()"></textarea>
<div id="result"></div>
</div>
<script src="./showdown.min.js"></script>
<script type="text/javascript">
function compile(){
var text = document.getElementById("content").value;
var converter = new showdown.Converter();
var html = converter.makeHtml(text);
document.getElementById("result").innerHTML = html;
}
</script>
</body>
</html>
