用JS库把markdown转换为html

技术

发布日期: 2020-05-22

更新日期: 2020-05-22

文章字数: 344

阅读时长: 1 分

阅读次数:

原来CSDN博客内容首发19年
在实习单位，要求写一个类似wiki的出来，然后本人JS学的不是很好，没办短时间写出来。从网上找了好多，也没有合适的，最后在推荐（具体是哪个大神现在找不到了等找到马上感谢他）这个https://github.com/showdownjs/showdown/releases直接下压缩包，然后dist文件里面引入shoudown.min.js即可。

<!DOCTYPE html>
<html>

<head>
    <title>伟大的毅哥的框架的使用指南</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <style>
        #text {
            display: none;
        }
    </style>
</head>

<body>
    <p id="text">{$text}</p>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <!--<script src="https://cdn.bootcss.com/showdown/1.3.0/showdown.min.js"></script>-->
    <script src="/showdown-1.9.0/dist/showdown.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            var content = $("#text").text(); //获取md文本内容
            var converter = new showdown.Converter(); //初始化转换器
            var htmlcontent = converter.makeHtml(content); //将MarkDown转为html格式的内容
            $("#article .article-entry").html(htmlcontent);
        }); //添加到 div 中 显示出来
    </script>
    <div id="article">
        <div class="article-entry">

        </div>
    </div>
</body>

</html>