markdown三种解析方式

markdown.js

下载地址:https://github.com/evilstreak/markdown-js

<script src="js/plugins/markdown.min.js"></script>
<div>
    <!-- 输入区 -->
    <textarea id="text-input" oninput="this.editor.update()">在此处输入相关markdown语句</textarea>
    <!-- 显示区 -->
    <div id="preview" class="pull-left"> </div>
</div>
<script>
    // markdown
    function Editor(input, preview) {
        this.update = function () {
            preview.innerHTML = markdown.toHTML(input.value);
        };
        input.editor = this;
        this.update();
    }
    var _a = function (id) { return document.getElementById(id); };
    new Editor(_a("text-input"), _a("preview"));
</script>

showdown.js

下载地址:https://github.com/showdownjs/showdown
参考地址:http://www.jianshu.com/p/747d6f8dddb0
(找了一些参考网页,发现这个最有用)

<div>
    <textarea id="content" style="" onkeyup="convert()"></textarea>
    <div id="result">
</div>
<script src="https://cdn.bootcss.com/showdown/1.3.0/showdown.min.js"></script> 
<script>  
    function convert(){
        //获取要转换的文字
        var text = document.getElementById("content").value;
        //创建实例
        var converter = new showdown.Converter();
        //进行转换
        var html = converter.makeHtml(text);
        //展示到对应的地方  result便是id名称
     document.getElementById("result").innerHTML = html;
    }
</script>  

strapdown.js

下载地址:https://github.com/arturadib/strapdown
参考地址:http://strapdownjs.com/
strapdown 有一些主题可以直接使用 更改theme的属性值就可以了(主题有:amelia、cerulean、cyborg、journal、readable、simplex、slate等)

<textarea theme="united" style="display:block;">
</textarea>
<script src="strapdown.js"></script>

原文链接:https://blog.csdn.net/pengxiaotongvip/article/details/72932041

posted @   沐雨辰沨  阅读(2154)  评论(0编辑  收藏  举报
编辑推荐:
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 单元测试从入门到精通
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律
点击右上角即可分享
微信分享提示