博主参考的文章

什么是Markdown

Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式。

最直观的方法,CSDN写新文章用Markdown编辑器,自己琢磨下便知


什么是Editor.MD

Editor.md 是一个可嵌入的开源 Markdown 在线编辑器组件,你可以很方便用在浏览器、NW.js(Node-webkit)等地方,基于CodeMirror、jQuery 和 Marked 构建。

Editor.MD官方显示 CSDN 也在用该组件


环境准备

Editor.MD 官方网址(包含下载)

下载完成你就得到了这么个玩意↓

examples文件夹下有很多示例,可以打开参考学习,或者直接去官方网站示例。

但是要想 EditorMD 在自己的 Web 项目里跑起来,我们只需要把 editor.md-master 文件目录下的这些文件放在自己的 Web 项目 资源文件夹,存放位置决定了你使用时填写的路径。

注意:

EditorMD开启 emoji 后 github 的出于某种原因是无法使用的,我们需要手动修改图片下载路径

首先先得把 emoji 表情下载到本地
emoji 下载地址

然后把它放在

接下来得修改 js 文件里的路径 (路径值取决于你存放图片的位置)

这四个文件里的emoji路径都得修改一个都不能少


小例子

对应上图的aa.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>EditorMD</title>
<link type="text/css" href="plug-ins/EditorMD/lib/codemirror/codemirror.min.css">
<script type="text/javascript" src="plug-ins/JQuery/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="plug-ins/EditorMD/editormd.min.js"></script>
<link rel="stylesheet" href="plug-ins/EditorMD/css/editormd.css">
</head><body>
<div id="layout"><header><h1>动态创建 Editor.md</h1><p>Dynamic create Editor.md</p><br><div class="btns" style="margin:0;"><button id="create-btn">动态创建一个 Editor.md</button><button id="remove-btn">移除 Editor.md</button></div></header>
</div><script type="text/javascript">var testEditormd;$(function () {$("#create-btn").click(function () {$("#layout").append("<div id=\"test-editormd\"></div>");testEditormd = editormd("test-editormd", {width: "90%",height: 640,emoji: true,markdown: "### 动态创建 Editor.md\r\n\r\nDynamic create Editor.md",path: 'plug-ins/EditorMD/lib/'});});$("#remove-btn").click(function () {testEditormd.editor.remove();});});
</script>
</body>
</html>

关于 EditorMD 对象可用函数、可配置参数
如果能看懂 editormd.js 文件的话,基本就知道了
简单的着手方式:可在 官方页面自行进入使用示例 里找

快速入门 Editor.MD---在Web项目里使用 Markdown 编辑器相关推荐

  1. git快速入门-笔记(MD格式)

    git快速入门-笔记(MD格式) http://www.php.cn/code/9058.html git是一种版本控制器.原来就是针对linux系统. 下载安装 - https://git-scm. ...

  2. 快速发布windows上的web项目【免费内网穿透】

    快速发布windows上的web项目[免费内网穿透] 文章目录 快速发布windows上的web项目[免费内网穿透] 什么是cpolar内网穿透? 概述 1. 搭建一个静态Web站点 1.1 下载演示 ...

  3. Tomcat快速入门(Tomcat安装 把一个项目发布到tomcat中 Eclipse配置Tomcat idea配置tomcat)

    文章目录 服务器的概念 服务器 Web服务器软件:接收客户端发送的请求和响应客户端请求. 常见的Web服务器软件 Tomcat安装 win下启动乱码问题解决 Tomcat目录介绍 如何把一个项目发布到 ...

  4. 如何快速在东方通服务器部署web项目

    一.安装JDK,配置环境变量 二.TongWeb中间件安装部署 将TongWeb中间件绿色免安装版解压后,在TongWeb根目录下放入许可证license.dat. 注意:TongWeb解压目录不要包 ...

  5. PHP项目中使用 Markdown编辑器

    个人站点 :http://oldchen.iwulai.com/ Markdown在技术圈越来越受欢迎,今天为大家带来一款国内开源的比较好用的Markdown编辑器--editor.md. 在这次项目 ...

  6. jquery mobile快速入门_【K些项目】学透jquery,11个国内最新项目资料

    对代码.编程感兴趣的可以关注老K玩代码和我交流! " jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaSc ...

  7. C 语言快速入门,21 个小项目足矣!「不走弯路就是捷径」

    C 语言作为大学理工科专业的必修,是很多同学走进编程世界的第一课.那么怎样才能更好的入门 C 语言呢? 下面整理了 21 个 C 语言练手项目,从基础语法开始,逐步深入,通过一个个练手项目,让你轻松驰 ...

  8. Go语言从入门到精通 -【web项目实战篇】- Json详解

    本节核心内容 介绍GoLang自带的json包的核心功能方法 介绍如何利用Tag对Json结构体实现更多的控制 介绍Json的编码器和解码器 介绍如何解决复合结构体的数据读取问题 介绍了开发中一些常见 ...

  9. 【数字IC验证快速入门】45、UVM项目实践之APB_SPI(13)UVM 验证方法学总结

    导读:作者有幸在中国电子信息领域的排头兵院校"电子科技大学"攻读研究生期间,接触到前沿的数字IC验证知识,旁听到诸如华为海思.清华紫光.联发科技等业界顶尖集成电路相关企业面授课程, ...

最新文章

  1. C# 一个操作Oracle的简易工具类(通过System.Data.OracleClient)
  2. python网上编程课程-零基础程序设计(Python入门)
  3. java 中 Object XML 互转,最终选择Xstream
  4. 滴水穿石--MYSQL导入导出常用命令
  5. python需要的环境_python运行环境是什么
  6. java.lang.ClassNotFoundException: net.sf.ezmorph.Morpher
  7. 来自 PHP 之外的变量(HTML 表单中的数组、变量名中的点)
  8. Elasticsearch -- Java High Level REST Client (RestHighLevelClient) 使用说明文档
  9. 5个常用的Java微服务开源框架推荐
  10. EasyCHM(CHM电子书制作工具) v3.84.545 绿色版
  11. 《一个人工智能的诞生》学习记录
  12. 保定2021高考学校成绩查询,2021年保定高考成绩排名查询,成绩什么时候可以查询...
  13. DDR SDRAM内存优化
  14. 油猴安装、编写及添加脚本 笔记
  15. javascript bool 强制类型转换
  16. NoSQL与SQL:选择数据管理解决方案
  17. 实时即未来,车联网项目之远程诊断实时故障分析【七】
  18. 明年放假时间表总共29天7个节假日
  19. 解析因人工智能技术变革而产生的价值观
  20. Jquery实现emoji表情包输入

热门文章

  1. 简单两招教会您,电脑怎么录屏
  2. mysql数据库中常用的类型_MySQL数据库中常用字段类型
  3. 软件推荐(可免费试用)
  4. 浏览器添加油猴插件(Tampermonkey)
  5. oracle查询表空间和用户名,教你查询Oracle中的表空间
  6. 5G R17到底讲些什么?
  7. babel之配置文件.babelrc入门详解
  8. 记录一下平常会用到的Linux命令
  9. Python 爬取高清桌面壁纸
  10. 合格的php程序员要求,怎样成为一名合格的PHP程序员