将markdown文件转为html的一种方法

解决Markdown文本后台传入前端解析成Html

自己在用springboot写个人博客的时候,在页面md编辑传入数据库后,用 thymeleaf 模板的 th:utext 无法正确解析成功,也导入了依赖和官网教的配置类。。最后都不成功,
最后发现了一种方式 也分享给你们。。—>–>->

转换的方法有很多种,我使用了这个,也不用特别对表格什么的多费心,直接最后就加了这一点代码就成了


<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>

************************************************
<!-- 这里我在要显示数据的div上面添加了一个input隐藏域 id 为middle th:value="${后台的md}"-->
                  **********************************************
<script type="text/javascript"> 
    var content = $("#middle").val(); //使用el表达式获取后台返回的markdown内容
    var converter = new showdown.Converter(); //初始化转换器
    var htmlcontent  = converter.makeHtml(content); //将MarkDown转为html格式的内容
    $("#article").html(htmlcontent);//添加到div中显示出来

************************************
如果不希望在前端的开发者工具里显示出来后台的数据
                 **********************************
 在 js 最后把把input的值置空
 $("#middle").attr("value", "");
 
</script> 

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值