Html中引入和显示Markdown文件

背景:
在使用Markdown编写开发文档时,由于Markdown语法不支持锚点跳转,于是想到把 .md文档加载到Html页面通过 a 标签里来实现跳转。
1、ajax请求加载本地md

将请求到的文件添加到 <div id="content">

$(function(){
        $.ajax({
            type:"get",
            url:"./test.md",
            dataType:"html",
            success:function(res){
            $("#content").append(marked(res));  // 使用marked插件解析.md文件
            }
        })
    })
2.解析 xxx.md

解析需使用marked插件库,将md文本转化为html DOM,框架Github地址——戳戳戳!

引入marked.js <script src="./marked.js"></script>

3.编写css

由于转化后的md没有了基本的css样式,需要自行编写,其中代码高亮可使用Highlight插件,使用方法可参考☞《highlight.js代码高亮使用》

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值