您现在的位置是:首页 > PHP框架交流PHP框架交流

使用Editor.md通过Editor.getHTML()保存html 前端页面如何显示

上善若水2020-06-11 11:52:57【PHP框架交流】 4097人已围观

简介项目使用上拉Editor.mdmarkdown编辑器后,在前端页面上发现所有的样式与预览的样式都丢了,原因是前端样式需要处理后才能正常显示,看看解决办法吧!以下涉及资源的路径请自行修改具体路径自行

项目使用上拉Editor.md markdown编辑器后,在前端页面上发现所有的样式与预览的样式都丢了,原因是前端样式需要处理后才能正常显示,看看解决办法吧!
以下涉及资源的路径请自行修改具体路径自行

1.引入css

引入<link rel="stylesheet" href="/static/vendor/editor.md/css/editormd.css" />

2.引入js

<script src="/static/js/jquery-1.8.3.min.js"></script>
<script src="/static/vendor/editor.md/editormd.js"></script>
<script src="/static/vendor/editor.md/lib/marked.min.js"></script>
<script src="/static/vendor/editor.md//lib/prettify.min.js"></script>

3.模板引擎渲染html,取出html代码

<div id="my-content">{{$article.content|raw}}</div>,代码为thinkphp6语法

4.js格式化html并显示

$(function () {
            editormd.markdownToHTML("my-content");
})

5.最后对比两者的显示差异
未处理前
image.png
处理后显示正常
image.png
参考大佬文章: https://www.jianshu.com/p/02e3065c35d8

Tags: markdown

很赞哦! (3)

相关文章

随机图文

文章评论

站点信息

  • 建站时间:2019-10-24
  • 网站程序:Thinkphp6 Layui
  • 文章统计247篇文章
  • 标签管理标签云
  • 统计数据cnzz统计
  • 微信公众号:扫描二维码,关注我们