Markdown的语法简洁明了、学习容易,而且功能比纯文本更强,因此有很多人用它写博客。
最近想自己动手写一个博客系统,然后查了下博客系统一般构造,发现目前大部分博客把Markdown作为博客的标配了。网上有很多markdown的解析插件,我一开始用的事markdown-js.js,但这个插件实在太坑了,代码块和表格都不能很好的处理;然后又用了strapdown.js,只能说这个插件太好了,它会给你一些不想要的东东。所以对比下来我选择了marked.js。这个插件用起来很简单,调用marke("md")
就能解析你的markdown文本。
第一步:实现markdown编写实时预览
为了让页面好看,采用了bootstrap框架,实现左栏textarea写代码,通过监听键盘按下事件keyup
和失去焦点事件blur
,向右栏div
实时插入解析的代码
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">