zoukankan      html  css  js  c++  java
  • CSDN-markdown编辑器之导入导出文档功能


    CSDN-markdown编辑器支持从线上和本地导入Markdown文件、导出Markdown文件和HTML文件的功能。在工具栏上有三个button来实现这些功能。这三个button各自是:从线上导入MD文件、从本机导入MD文件、导出到本地。

    导入导出MD

    • CSDN-markdown编辑器的导入功能让我们非常方便的基于已有的Markdown文件进行又一次编辑改动。然后发表博文。

    • CSDN-markdown编辑器的导出功能让我们非常easy的将在CSDN上发表的博文进行本地存档备份,或者你导出到本地后,再上传到CSDN CODE上进行在线存档备份。


    这是一篇傻瓜式手把手多图教程。介绍这导入导出的使用方式。


    从线上导入Markdown文件


    这里以我的github的一个项目『IT-Interviews-Sharing』的README.md文件为例进行解说。

    第一步:得到你要导入的MD文件的网址,并复制下来

    对于Github上面的MD文件,我们不能直接将MD文件转成HTML效果之后的网址拷贝下来。由于这时候的网址是html文件的网址而不是原来MD文件的网址,怎么找到原生MD文件的网址呢?

    非常简单。仅仅要点击html效果页的“Raw”button就可以。例如以下:

    md文件网址

    这才是真正的MD文件网址,拷贝下来:

    https://raw.githubusercontent.com/lanxuezaipiao/IT-Interviews-Sharing/master/README.md
    

    这里写图片描写叙述

    第二步:点击工具栏上的“从线上导入”图标

    线上导入

    第三步:这时弹出一个“从线上导入”对话框。我们将复制的网址直接粘贴进去,点击“确定”就可以

    这里写图片描写叙述

    稍等片刻,我们所需的MD文件就成功导进来了。

    这里写图片描写叙述

    注意事项:

    那个导入对话框里的红色文字那么醒目,相信大家都已经看到了,一定要谨记。

    假设你正在写一篇文章,突然想试验下导入功能。也忘记点击“保存”button这里写图片描写叙述(上面有红点就表示你还未保存到最新状态)以保存到草稿箱,那么你辛辛苦苦写的文章就荡然无存了。

    我觉得在导入时点击确定button后。最好有个检測功能,假设检測到你当前的编辑器是空的。就直接导入,假设检測到里面有内容而且未保存到最新状态。就弹出一个对话框,给个提示。比方“您当前尚有内容未保存。确定要覆盖当前全部内容吗?”。


    从本机导入Markdown文件

    第一步:点击工具栏上的“从本机导入”图标

    本机导入

    第二步:这时弹出一个“从本机导入”对话框,能够发现有两种导入方式,任选一种就可以

    这里写图片描写叙述

    这个比較简单,就不演示了。


    导出Markdown文件到本地

    第一步:点击工具栏上的“导出到本地”图标

    导出本地

    第二步:这时弹出一个“导出到文档”对话框,能够发现有三种导出方式:导出到md文件、导出到仅内容的HTML文件、导出到带模板的HTML文件

    这里写图片描写叙述

    这里可能有人会问:后面两种导出方式有什么差别呢?

    事实上从字面上就能够看出,“带模板的HTML文件”就是比“仅内容的HTML文件”多一个HTML模板,也就是多了以下这样一段内容:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>文章标题</title>
    <link rel="stylesheet" href="https://stackedit.io/res-min/themes/base.css" />
    <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML"></script>
    </head>
    <body><div class="container">
    
    ......
    
    </div></body>
    </html>
  • 相关阅读:
    适配器模式(16)
    状态模式(15)
    用反射技术替换工厂种的switch分支(14)
    2017年目标与规划
    抽象工厂模式(13)
    观察者模式(12)
    建造者模式(11)
    TCP 可靠传输与流量控制的实现
    TCP报文段的首部格式
    TCP可靠传输的工作原理
  • 原文地址:https://www.cnblogs.com/wgwyanfs/p/7382294.html
Copyright © 2011-2022 走看看