超簡単 MarkedJS を使用してmarkdownからhtmlへの変換を行う方法

超簡単です。ブラウザ側で、Markdown から HTML に変換して、表示します。

1. ソースコード

<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>

<div id="IDDivHtmlArea"></div>

var IDDivHtmlArea = document.getElementById("IDDivHtmlArea");

IDDivHtmlArea.innerHTML = marked(’# This is Markdown Header’);

これだけです。これだけで、「# This is Markdown Header」がHTML に変換されて表示されます。

まず、HTML で「IDDivHtmlArea」というID でDivタグを作成します。この中に、Markdown から変換されたHTML文章が表示されます。

marked(’# This is Markdown Header’);

これだけですね。これをIDDivHtmlAreaにセットすれば、完了です。