美文网首页
markdown的使用

markdown的使用

作者: 三省吾身_9862 | 来源:发表于2019-01-18 17:13 被阅读8次

在这里介绍浏览器上直接使用markdown,以及在nodejs上使用markdown

一、浏览器上直接使用markdown

html代码展示:

<head>
<link href="./css/monokai_sublime.min.css" rel="stylesheet">
<script src="./js/marked.min.js"></script>
<script src="./js/highlight.min.js"></script>
</head>
<body>
<!-- 输入文本 -->
<textarea id="editContent"></textarea>
<!-- 展示文本 -->
<div id="markContent"></div>

<script>
hljs.initHighlightingOnLoad();

marked.setOptions({
      renderer: new marked.Renderer(),
      gfm: true,
      tables: true,
      breaks: false,
      pedantic: false,
      sanitize: false,
      smartLists: true,
      smartypants: false,
      highlight: function (code) {
        return hljs.highlightAuto(code).value;
      }
});

document.getElementById('editContent').addEventListener('input', () => {
  let val = this.value,
       markText = marked(val);
  document.getElementById('markContent').innerHTML = markText;
}, false);
</script>
</body>

二、nodejs上使用markdown

在这里介绍如何使用vuepress;构建markdown

相关文章

网友评论

      本文标题:markdown的使用

      本文链接:https://www.haomeiwen.com/subject/bzondqtx.html