markdown的使用

時間 2019-12-09

原文原文鏈接

在這裏介紹瀏覽器上直接使用markdown，以及在nodejs上使用markdowncss

1、瀏覽器上直接使用markdown

html代碼展現: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>
複製代碼