使用Editor.md实现博客markdown功能

最新推荐文章于 2021-04-15 22:17:13 发布

Jint001

最新推荐文章于 2021-04-15 22:17:13 发布

阅读量208

点赞数 1

本文链接：https://blog.csdn.net/qq_44972847/article/details/108922049

版权

建个人博客需要实现markdown功能。我最终在github上找到了相关方法。

Editor.md 是一款开源的、可嵌入的 Markdown 在线编辑器（组件），基于 CodeMirror、jQuery 和 Marked 构建。

github：https://github.com/pandao/editor.md

官网：https://pandao.github.io/editor.md/

安装

Editor.md

用法

Markdown编辑器

官方写法

<link rel="stylesheet" href="/editor.md-master/css/editormd.css" />
<div id="editor">
    <!-- Tips: Editor.md can auto append a `<textarea>` tag -->
    <textarea style="display:none;">### Hello Editor.md !</textarea>
</div>
<script src="/editor.md-master/examples/js/jquery.min.js"></script>
<script src="/editor.md-master/editormd.js"></script>
<script type="text/javascript">
    $(function() {
        var editor = editormd("editor", {
            // width: "100%",
            // height: "100%",
            // markdown: "xxxx",     // dynamic set Markdown text
            path : "/editor.md-master/lib/"  // Autoload modules mode, codemirror, marked... dependents libs path
        });
    });
</script>

个人写法

<head>
  <meta charset="utf-8" />
  <title>markdown编辑器</title>
  <link rel="stylesheet" href="/editor.md-master/css/editormd.css" />
  
</head>

<body>
    <div id="editor">
        <!-- Tips: Editor.md can auto append a `<textarea>` tag -->
        <textarea style="display:none;">### Hello Editor.md !</textarea>
    </div>
    
    <script src="/editor.md-master/examples/js/jquery.min.js"></script>
  	<script src="/editor.md-master/editormd.js"></script>
    <script type="text/javascript">
        $(function() {
            var editor = editormd("editor", {
                // width: "100%",
                // height: "100%",
                // markdown: "xxxx",     // dynamic set Markdown text
                path : "/editor.md-master/lib/"  // Autoload modules mode, codemirror, marked... dependents libs path
            });
        });
    </script>
</body>

实现效果

在这里插入图片描述

Jint001

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
使用Editor.md实现博客markdown功能

建个人博客需要实现markdown功能。我最终在github上找到了相关方法。Editor.md 是一款开源的、可嵌入的 Markdown 在线编辑器（组件），基于 CodeMirror、jQuery 和 Marked 构建。github：https://github.com/pandao/editor.md官网：https://pandao.github.io/editor.md/安装Editor.md 用法Markdown编辑器官方写法<link rel="st.
复制链接

扫一扫