pandao
6 years ago
10 changed files with 994 additions and 918 deletions
@ -1,271 +1,271 @@ |
|||
# Editor.md |
|||
|
|||
 |
|||
|
|||
 |
|||
 |
|||
 |
|||
 |
|||
 |
|||
 |
|||
|
|||
**Editor.md** : The open source embeddable online markdown editor (component), based on CodeMirror & jQuery & Marked. |
|||
|
|||
### Features |
|||
|
|||
- Support Standard Markdown / CommonMark and GFM (GitHub Flavored Markdown); |
|||
- Full-featured: Real-time Preview, Image (cross-domain) upload, Preformatted text/Code blocks/Tables insert, Code fold, Search replace, Read only, Themes, Multi-languages, L18n, HTML entities, Code syntax highlighting...; |
|||
- Markdown Extras : Support [ToC (Table of Contents)](https://pandao.github.io/editor.md/examples/toc.html), [Emoji](https://pandao.github.io/editor.md/examples/emoji.html), [Task lists](https://pandao.github.io/editor.md/examples/task-lists.html), [@Links](https://pandao.github.io/editor.md/examples/@links.html)...; |
|||
- Compatible with all major browsers (IE8+), compatible Zepto.js and iPad; |
|||
- Support [decode & fliter of the HTML tags & attributes](https://pandao.github.io/editor.md/examples/html-tags-decode.html); |
|||
- Support [TeX (LaTeX expressions, Based on KaTeX)](https://pandao.github.io/editor.md/examples/katex.html), [Flowchart](https://pandao.github.io/editor.md/examples/flowchart.html) and [Sequence Diagram](https://pandao.github.io/editor.md/examples/sequence-diagram.html) of Markdown extended syntax; |
|||
- Support AMD/CMD (Require.js & Sea.js) Module Loader, and Custom/define editor plugins; |
|||
|
|||
[README & Examples (English)](https://pandao.github.io/editor.md/en.html) |
|||
|
|||
|
|||
-------- |
|||
|
|||
**Editor.md** 是一款开源的、可嵌入的 Markdown 在线编辑器（组件），基于 CodeMirror、jQuery 和 Marked 构建。 |
|||
|
|||
 |
|||
|
|||
#### 主要特性 |
|||
|
|||
- 支持通用 Markdown / CommonMark 和 GFM (GitHub Flavored Markdown) 风格的语法，也可[变身为代码编辑器](https://pandao.github.io/editor.md/examples/change-mode.html)； |
|||
- 支持实时预览、图片（跨域）上传、预格式文本/代码/表格插入、代码折叠、跳转到行、搜索替换、只读模式、自定义样式主题和多语言语法高亮等功能； |
|||
- 支持 [ToC（Table of Contents）](https://pandao.github.io/editor.md/examples/toc.html)、[Emoji表情](https://pandao.github.io/editor.md/examples/emoji.html)、[Task lists](https://pandao.github.io/editor.md/examples/task-lists.html)、[@链接](https://pandao.github.io/editor.md/examples/@links.html)等 Markdown 扩展语法； |
|||
- 支持 TeX 科学公式（基于 [KaTeX](https://pandao.github.io/editor.md/examples/katex.html)）、流程图 [Flowchart](https://pandao.github.io/editor.md/examples/flowchart.html) 和 [时序图 Sequence Diagram](https://pandao.github.io/editor.md/examples/sequence-diagram.html); |
|||
- 支持[识别和解析 HTML 标签，并且支持自定义过滤标签及属性解析](https://pandao.github.io/editor.md/examples/html-tags-decode.html)，具有可靠的安全性和几乎无限的扩展性； |
|||
- 支持 AMD / CMD 模块化加载（支持 [Require.js](https://pandao.github.io/editor.md/examples/use-requirejs.html) & [Sea.js](https://pandao.github.io/editor.md/examples/use-seajs.html)），并且支持[自定义扩展插件](https://pandao.github.io/editor.md/examples/define-plugin.html)； |
|||
- 兼容主流的浏览器（IE8+）和 [Zepto.js](https://pandao.github.io/editor.md/examples/use-zepto.html)，且支持 iPad 等平板设备； |
|||
|
|||
#### Download & install |
|||
|
|||
Download: |
|||
|
|||
[Github download](https://github.com/pandao/editor.md/archive/master.zip) |
|||
|
|||
NPM install : |
|||
|
|||
```bash |
|||
npm install editor.md |
|||
``` |
|||
|
|||
Bower install : |
|||
|
|||
```bash |
|||
bower install editor.md |
|||
``` |
|||
|
|||
#### Usages |
|||
|
|||
##### Create a Markdown editor |
|||
|
|||
```html |
|||
<link rel="stylesheet" href="editor.md/css/editormd.min.css" /> |
|||
<div id="editor"> |
|||
<!-- Tips: Editor.md can auto append a `<textarea>` tag --> |
|||
<textarea style="display:none;">### Hello Editor.md !</textarea> |
|||
</div> |
|||
<script src="jquery.min.js"></script> |
|||
<script src="editor.md/editormd.min.js"></script> |
|||
<script type="text/javascript"> |
|||
$(function() { |
|||
var editor = editormd("editor", { |
|||
// width: "100%", |
|||
// height: "100%", |
|||
// markdown: "xxxx", // dynamic set Markdown text |
|||
path : "editor.md/lib/" // Autoload modules mode, codemirror, marked... dependents libs path |
|||
}); |
|||
}); |
|||
</script> |
|||
``` |
|||
|
|||
If you using modular script loader: |
|||
|
|||
- [Using Require.js](https://github.com/pandao/editor.md/tree/master/examples/use-requirejs.html) |
|||
- [Using Sea.js](https://github.com/pandao/editor.md/tree/master/examples/use-seajs.html) |
|||
|
|||
##### Markdown to HTML |
|||
|
|||
```html |
|||
<link rel="stylesheet" href="editormd/css/editormd.preview.css" /> |
|||
<div id="test-markdown-view"> |
|||
<!-- Server-side output Markdown text --> |
|||
<textarea style="display:none;">### Hello world!</textarea> |
|||
</div> |
|||
<script src="jquery.min.js"></script> |
|||
<script src="editormd/editormd.js"></script> |
|||
<script src="editormd/lib/marked.min.js"></script> |
|||
<script src="editormd/lib/prettify.min.js"></script> |
|||
<script type="text/javascript"> |
|||
$(function() { |
|||
var testView = editormd.markdownToHTML("test-markdown-view", { |
|||
// markdown : "[TOC]\n### Hello world!\n## Heading 2", // Also, you can dynamic set Markdown text |
|||
// htmlDecode : true, // Enable / disable HTML tag encode. |
|||
// htmlDecode : "style,script,iframe", // Note: If enabled, you should filter some dangerous HTML tags for website security. |
|||
}); |
|||
}); |
|||
</script> |
|||
``` |
|||
|
|||
> See the full example: [http://editor.md.ipandao.com/examples/html-preview-markdown-to-html.html](http://editor.md.ipandao.com/examples/html-preview-markdown-to-html.html) |
|||
|
|||
##### HTML to Markdown? |
|||
|
|||
Sorry, Editor.md not support HTML to Markdown parsing, Maybe In the future. |
|||
|
|||
#### Examples |
|||
|
|||
[https://pandao.github.io/editor.md/examples/index.html](https://pandao.github.io/editor.md/examples/index.html) |
|||
|
|||
#### Options |
|||
|
|||
Editor.md options and default values: |
|||
|
|||
```javascript |
|||
{ |
|||
mode : "gfm", // gfm or markdown |
|||
name : "", // Form element name for post |
|||
value : "", // value for CodeMirror, if mode not gfm/markdown |
|||
theme : "", // Editor.md self themes, before v1.5.0 is CodeMirror theme, default empty |
|||
editorTheme : "default", // Editor area, this is CodeMirror theme at v1.5.0 |
|||
previewTheme : "", // Preview area theme, default empty |
|||
markdown : "", // Markdown source code |
|||
appendMarkdown : "", // if in init textarea value not empty, append markdown to textarea |
|||
width : "100%", |
|||
height : "100%", |
|||
path : "./lib/", // Dependents module file directory |
|||
pluginPath : "", // If this empty, default use settings.path + "../plugins/" |
|||
delay : 300, // Delay parse markdown to html, Uint : ms |
|||
autoLoadModules : true, // Automatic load dependent module files |
|||
watch : true, |
|||
placeholder : "Enjoy Markdown! coding now...", |
|||
gotoLine : true, // Enable / disable goto a line |
|||
codeFold : false, |
|||
autoHeight : false, |
|||
autoFocus : true, // Enable / disable auto focus editor left input area |
|||
autoCloseTags : true, |
|||
searchReplace : true, // Enable / disable (CodeMirror) search and replace function |
|||
syncScrolling : true, // options: true | false | "single", default true |
|||
readOnly : false, // Enable / disable readonly mode |
|||
tabSize : 4, |
|||
indentUnit : 4, |
|||
lineNumbers : true, // Display editor line numbers |
|||
lineWrapping : true, |
|||
autoCloseBrackets : true, |
|||
showTrailingSpace : true, |
|||
matchBrackets : true, |
|||
indentWithTabs : true, |
|||
styleSelectedText : true, |
|||
matchWordHighlight : true, // options: true, false, "onselected" |
|||
styleActiveLine : true, // Highlight the current line |
|||
dialogLockScreen : true, |
|||
dialogShowMask : true, |
|||
dialogDraggable : true, |
|||
dialogMaskBgColor : "#fff", |
|||
dialogMaskOpacity : 0.1, |
|||
fontSize : "13px", |
|||
saveHTMLToTextarea : false, // If enable, Editor will create a <textarea name="{editor-id}-html-code"> tag save HTML code for form post to server-side. |
|||
disabledKeyMaps : [], |
|||
|
|||
onload : function() {}, |
|||
onresize : function() {}, |
|||
onchange : function() {}, |
|||
onwatch : null, |
|||
onunwatch : null, |
|||
onpreviewing : function() {}, |
|||
onpreviewed : function() {}, |
|||
onfullscreen : function() {}, |
|||
onfullscreenExit : function() {}, |
|||
onscroll : function() {}, |
|||
onpreviewscroll : function() {}, |
|||
|
|||
imageUpload : false, // Enable/disable upload |
|||
imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"], |
|||
imageUploadURL : "", // Upload url |
|||
imageUploadFields : "", // append upload form fields for CRSF etc. Server-side receives the POST parameters. v1.5.1+ |
|||
imageUploadCallback : function() {}, // set image upload finish (success or failure) callback handler v1.5.1+ |
|||
imageUploadCallbackName : '__Editor_md_ImageUploadCallback', // upload callback name for cross-domain upload v1.5.1+ |
|||
crossDomainUpload : false, // Enable/disable Cross-domain upload |
|||
uploadCallbackURL : "", // Cross-domain upload callback url |
|||
|
|||
toc : true, // Table of contents |
|||
tocm : false, // Using [TOCM], auto create ToC dropdown menu |
|||
tocTitle : "", // for ToC dropdown menu button |
|||
tocDropdown : false, // Enable/disable Table Of Contents dropdown menu |
|||
tocContainer : "", // Custom Table Of Contents Container Selector |
|||
tocStartLevel : 1, // Said from H1 to create ToC |
|||
htmlDecode : false, // Open the HTML tag identification |
|||
pageBreak : true, // Enable parse page break [========] |
|||
atLink : true, // for @link |
|||
emailLink : true, // for email address auto link |
|||
taskList : false, // Enable Github Flavored Markdown task lists |
|||
emoji : false, // :emoji: , Support Github emoji, Twitter Emoji (Twemoji); |
|||
// Support FontAwesome icon emoji :fa-xxx: > Using fontAwesome icon web fonts; |
|||
// Support Editor.md logo icon emoji :editormd-logo: :editormd-logo-1x: > 1~8x; |
|||
tex : false, // TeX(LaTeX), based on KaTeX |
|||
flowChart : false, // flowChart.js only support IE9+ |
|||
sequenceDiagram : false, // sequenceDiagram.js only support IE9+ |
|||
previewCodeHighlight : true, // Enable / disable code highlight of editor preview area |
|||
|
|||
toolbar : true, // show or hide toolbar |
|||
toolbarAutoFixed : true, // on window scroll auto fixed position |
|||
toolbarIcons : "full", // Toolbar icons mode, options: full, simple, mini, See `editormd.toolbarModes` property. |
|||
toolbarTitles : {}, |
|||
toolbarHandlers : { |
|||
ucwords : function() { |
|||
return editormd.toolbarHandlers.ucwords; |
|||
}, |
|||
lowercase : function() { |
|||
return editormd.toolbarHandlers.lowercase; |
|||
} |
|||
}, |
|||
toolbarCustomIcons : { // using html tag create toolbar icon, unused default <a> tag. |
|||
lowercase : "<a href=\"javascript:;\" title=\"Lowercase\" unselectable=\"on\"><i class=\"fa\" name=\"lowercase\" style=\"font-size:24px;margin-top: -10px;\">a</i></a>", |
|||
"ucwords" : "<a href=\"javascript:;\" title=\"ucwords\" unselectable=\"on\"><i class=\"fa\" name=\"ucwords\" style=\"font-size:20px;margin-top: -3px;\">Aa</i></a>" |
|||
}, |
|||
toolbarIconTexts : {}, |
|||
|
|||
lang : { // Language data, you can custom your language. |
|||
name : "zh-cn", |
|||
description : "开源在线Markdown编辑器<br/>Open source online Markdown editor.", |
|||
tocTitle : "目录", |
|||
toolbar : { |
|||
//... |
|||
}, |
|||
button: { |
|||
//... |
|||
}, |
|||
dialog : { |
|||
//... |
|||
} |
|||
//... |
|||
} |
|||
} |
|||
``` |
|||
|
|||
#### Dependents |
|||
|
|||
- [CodeMirror](http://codemirror.net/ "CodeMirror") |
|||
- [marked](https://github.com/markedjs/marked "marked") |
|||
- [jQuery](http://jquery.com/ "jQuery") |
|||
- [FontAwesome](http://fontawesome.io/ "FontAwesome") |
|||
- [github-markdown.css](https://github.com/sindresorhus/github-markdown-css "github-markdown.css") |
|||
- [KaTeX](http://khan.github.io/KaTeX/ "KaTeX") |
|||
- [prettify.js](http://code.google.com/p/google-code-prettify/ "prettify.js") |
|||
- [Rephael.js](http://raphaeljs.com/ "Rephael.js") |
|||
- [flowchart.js](http://adrai.github.io/flowchart.js/ "flowchart.js") |
|||
- [sequence-diagram.js](http://bramp.github.io/js-sequence-diagrams/ "sequence-diagram.js") |
|||
- [Prefixes.scss](https://github.com/pandao/prefixes.scss "Prefixes.scss") |
|||
|
|||
#### Changes |
|||
|
|||
[Change logs](https://github.com/pandao/editor.md/blob/master/CHANGE.md) |
|||
|
|||
#### License |
|||
|
|||
The MIT License. |
|||
|
|||
Copyright (c) 2015-2019 Pandao |
|||
# Editor.md |
|||
|
|||
 |
|||
|
|||
 |
|||
 |
|||
 |
|||
 |
|||
 |
|||
 |
|||
|
|||
**Editor.md** : The open source embeddable online markdown editor (component), based on CodeMirror & jQuery & Marked. |
|||
|
|||
### Features |
|||
|
|||
- Support Standard Markdown / CommonMark and GFM (GitHub Flavored Markdown); |
|||
- Full-featured: Real-time Preview, Image (cross-domain) upload, Preformatted text/Code blocks/Tables insert, Code fold, Search replace, Read only, Themes, Multi-languages, L18n, HTML entities, Code syntax highlighting...; |
|||
- Markdown Extras : Support [ToC (Table of Contents)](https://pandao.github.io/editor.md/examples/toc.html), [Emoji](https://pandao.github.io/editor.md/examples/emoji.html), [Task lists](https://pandao.github.io/editor.md/examples/task-lists.html), [@Links](https://pandao.github.io/editor.md/examples/@links.html)...; |
|||
- Compatible with all major browsers (IE8+), compatible Zepto.js and iPad; |
|||
- Support [decode & fliter of the HTML tags & attributes](https://pandao.github.io/editor.md/examples/html-tags-decode.html); |
|||
- Support [TeX (LaTeX expressions, Based on KaTeX)](https://pandao.github.io/editor.md/examples/katex.html), [Flowchart](https://pandao.github.io/editor.md/examples/flowchart.html) and [Sequence Diagram](https://pandao.github.io/editor.md/examples/sequence-diagram.html) of Markdown extended syntax; |
|||
- Support AMD/CMD (Require.js & Sea.js) Module Loader, and Custom/define editor plugins; |
|||
|
|||
[README & Examples (English)](https://pandao.github.io/editor.md/en.html) |
|||
|
|||
|
|||
-------- |
|||
|
|||
**Editor.md** 是一款开源的、可嵌入的 Markdown 在线编辑器（组件），基于 CodeMirror、jQuery 和 Marked 构建。 |
|||
|
|||
 |
|||
|
|||
#### 主要特性 |
|||
|
|||
- 支持通用 Markdown / CommonMark 和 GFM (GitHub Flavored Markdown) 风格的语法，也可[变身为代码编辑器](https://pandao.github.io/editor.md/examples/change-mode.html)； |
|||
- 支持实时预览、图片（跨域）上传、预格式文本/代码/表格插入、代码折叠、跳转到行、搜索替换、只读模式、自定义样式主题和多语言语法高亮等功能； |
|||
- 支持 [ToC（Table of Contents）](https://pandao.github.io/editor.md/examples/toc.html)、[Emoji表情](https://pandao.github.io/editor.md/examples/emoji.html)、[Task lists](https://pandao.github.io/editor.md/examples/task-lists.html)、[@链接](https://pandao.github.io/editor.md/examples/@links.html)等 Markdown 扩展语法； |
|||
- 支持 TeX 科学公式（基于 [KaTeX](https://pandao.github.io/editor.md/examples/katex.html)）、流程图 [Flowchart](https://pandao.github.io/editor.md/examples/flowchart.html) 和 [时序图 Sequence Diagram](https://pandao.github.io/editor.md/examples/sequence-diagram.html); |
|||
- 支持[识别和解析 HTML 标签，并且支持自定义过滤标签及属性解析](https://pandao.github.io/editor.md/examples/html-tags-decode.html)，具有可靠的安全性和几乎无限的扩展性； |
|||
- 支持 AMD / CMD 模块化加载（支持 [Require.js](https://pandao.github.io/editor.md/examples/use-requirejs.html) & [Sea.js](https://pandao.github.io/editor.md/examples/use-seajs.html)），并且支持[自定义扩展插件](https://pandao.github.io/editor.md/examples/define-plugin.html)； |
|||
- 兼容主流的浏览器（IE8+）和 [Zepto.js](https://pandao.github.io/editor.md/examples/use-zepto.html)，且支持 iPad 等平板设备； |
|||
|
|||
#### Download & install |
|||
|
|||
Download: |
|||
|
|||
[Github download](https://github.com/pandao/editor.md/archive/master.zip) |
|||
|
|||
NPM install : |
|||
|
|||
```bash |
|||
npm install editor.md |
|||
``` |
|||
|
|||
Bower install : |
|||
|
|||
```bash |
|||
bower install editor.md |
|||
``` |
|||
|
|||
#### Usages |
|||
|
|||
##### Create a Markdown editor |
|||
|
|||
```html |
|||
<link rel="stylesheet" href="editor.md/css/editormd.min.css" /> |
|||
<div id="editor"> |
|||
<!-- Tips: Editor.md can auto append a `<textarea>` tag --> |
|||
<textarea style="display:none;">### Hello Editor.md !</textarea> |
|||
</div> |
|||
<script src="jquery.min.js"></script> |
|||
<script src="editor.md/editormd.min.js"></script> |
|||
<script type="text/javascript"> |
|||
$(function() { |
|||
var editor = editormd("editor", { |
|||
// width: "100%", |
|||
// height: "100%", |
|||
// markdown: "xxxx", // dynamic set Markdown text |
|||
path : "editor.md/lib/" // Autoload modules mode, codemirror, marked... dependents libs path |
|||
}); |
|||
}); |
|||
</script> |
|||
``` |
|||
|
|||
If you using modular script loader: |
|||
|
|||
- [Using Require.js](https://github.com/pandao/editor.md/tree/master/examples/use-requirejs.html) |
|||
- [Using Sea.js](https://github.com/pandao/editor.md/tree/master/examples/use-seajs.html) |
|||
|
|||
##### Markdown to HTML |
|||
|
|||
```html |
|||
<link rel="stylesheet" href="editormd/css/editormd.preview.css" /> |
|||
<div id="test-markdown-view"> |
|||
<!-- Server-side output Markdown text --> |
|||
<textarea style="display:none;">### Hello world!</textarea> |
|||
</div> |
|||
<script src="jquery.min.js"></script> |
|||
<script src="editormd/editormd.js"></script> |
|||
<script src="editormd/lib/marked.min.js"></script> |
|||
<script src="editormd/lib/prettify.min.js"></script> |
|||
<script type="text/javascript"> |
|||
$(function() { |
|||
var testView = editormd.markdownToHTML("test-markdown-view", { |
|||
// markdown : "[TOC]\n### Hello world!\n## Heading 2", // Also, you can dynamic set Markdown text |
|||
// htmlDecode : true, // Enable / disable HTML tag encode. |
|||
// htmlDecode : "style,script,iframe", // Note: If enabled, you should filter some dangerous HTML tags for website security. |
|||
}); |
|||
}); |
|||
</script> |
|||
``` |
|||
|
|||
> See the full example: [http://editor.md.ipandao.com/examples/html-preview-markdown-to-html.html](http://editor.md.ipandao.com/examples/html-preview-markdown-to-html.html) |
|||
|
|||
##### HTML to Markdown? |
|||
|
|||
Sorry, Editor.md not support HTML to Markdown parsing, Maybe In the future. |
|||
|
|||
#### Examples |
|||
|
|||
[https://pandao.github.io/editor.md/examples/index.html](https://pandao.github.io/editor.md/examples/index.html) |
|||
|
|||
#### Options |
|||
|
|||
Editor.md options and default values: |
|||
|
|||
```javascript |
|||
{ |
|||
mode : "gfm", // gfm or markdown |
|||
name : "", // Form element name for post |
|||
value : "", // value for CodeMirror, if mode not gfm/markdown |
|||
theme : "", // Editor.md self themes, before v1.5.0 is CodeMirror theme, default empty |
|||
editorTheme : "default", // Editor area, this is CodeMirror theme at v1.5.0 |
|||
previewTheme : "", // Preview area theme, default empty |
|||
markdown : "", // Markdown source code |
|||
appendMarkdown : "", // if in init textarea value not empty, append markdown to textarea |
|||
width : "100%", |
|||
height : "100%", |
|||
path : "./lib/", // Dependents module file directory |
|||
pluginPath : "", // If this empty, default use settings.path + "../plugins/" |
|||
delay : 300, // Delay parse markdown to html, Uint : ms |
|||
autoLoadModules : true, // Automatic load dependent module files |
|||
watch : true, |
|||
placeholder : "Enjoy Markdown! coding now...", |
|||
gotoLine : true, // Enable / disable goto a line |
|||
codeFold : false, |
|||
autoHeight : false, |
|||
autoFocus : true, // Enable / disable auto focus editor left input area |
|||
autoCloseTags : true, |
|||
searchReplace : true, // Enable / disable (CodeMirror) search and replace function |
|||
syncScrolling : true, // options: true | false | "single", default true |
|||
readOnly : false, // Enable / disable readonly mode |
|||
tabSize : 4, |
|||
indentUnit : 4, |
|||
lineNumbers : true, // Display editor line numbers |
|||
lineWrapping : true, |
|||
autoCloseBrackets : true, |
|||
showTrailingSpace : true, |
|||
matchBrackets : true, |
|||
indentWithTabs : true, |
|||
styleSelectedText : true, |
|||
matchWordHighlight : true, // options: true, false, "onselected" |
|||
styleActiveLine : true, // Highlight the current line |
|||
dialogLockScreen : true, |
|||
dialogShowMask : true, |
|||
dialogDraggable : true, |
|||
dialogMaskBgColor : "#fff", |
|||
dialogMaskOpacity : 0.1, |
|||
fontSize : "13px", |
|||
saveHTMLToTextarea : false, // If enable, Editor will create a <textarea name="{editor-id}-html-code"> tag save HTML code for form post to server-side. |
|||
disabledKeyMaps : [], |
|||
|
|||
onload : function() {}, |
|||
onresize : function() {}, |
|||
onchange : function() {}, |
|||
onwatch : null, |
|||
onunwatch : null, |
|||
onpreviewing : function() {}, |
|||
onpreviewed : function() {}, |
|||
onfullscreen : function() {}, |
|||
onfullscreenExit : function() {}, |
|||
onscroll : function() {}, |
|||
onpreviewscroll : function() {}, |
|||
|
|||
imageUpload : false, // Enable/disable upload |
|||
imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"], |
|||
imageUploadURL : "", // Upload url |
|||
imageUploadFields : "", // append upload form fields for CRSF etc. Server-side receives the POST parameters. v1.5.1+ |
|||
imageUploadCallback : function() {}, // set image upload finish (success or failure) callback handler v1.5.1+ |
|||
imageUploadCallbackName : '__Editor_md_ImageUploadCallback', // upload callback name for cross-domain upload v1.5.1+ |
|||
crossDomainUpload : false, // Enable/disable Cross-domain upload |
|||
uploadCallbackURL : "", // Cross-domain upload callback url |
|||
|
|||
toc : true, // Table of contents |
|||
tocm : false, // Using [TOCM], auto create ToC dropdown menu |
|||
tocTitle : "", // for ToC dropdown menu button |
|||
tocDropdown : false, // Enable/disable Table Of Contents dropdown menu |
|||
tocContainer : "", // Custom Table Of Contents Container Selector |
|||
tocStartLevel : 1, // Said from H1 to create ToC |
|||
htmlDecode : false, // Open the HTML tag identification, If set String value expression : tagName,tagName,...|attrName,attrName,... |
|||
pageBreak : true, // Enable parse page break [========] |
|||
atLink : true, // for @link |
|||
emailLink : true, // for email address auto link |
|||
taskList : false, // Enable Github Flavored Markdown task lists |
|||
emoji : false, // :emoji: , Support Github emoji, Twitter Emoji (Twemoji); |
|||
// Support FontAwesome icon emoji :fa-xxx: > Using fontAwesome icon web fonts; |
|||
// Support Editor.md logo icon emoji :editormd-logo: :editormd-logo-1x: > 1~8x; |
|||
tex : false, // TeX(LaTeX), based on KaTeX |
|||
flowChart : false, // flowChart.js only support IE9+ |
|||
sequenceDiagram : false, // sequenceDiagram.js only support IE9+ |
|||
previewCodeHighlight : true, // Enable / disable code highlight of editor preview area |
|||
|
|||
toolbar : true, // show or hide toolbar |
|||
toolbarAutoFixed : true, // on window scroll auto fixed position |
|||
toolbarIcons : "full", // Toolbar icons mode, options: full, simple, mini, See `editormd.toolbarModes` property. |
|||
toolbarTitles : {}, |
|||
toolbarHandlers : { |
|||
ucwords : function() { |
|||
return editormd.toolbarHandlers.ucwords; |
|||
}, |
|||
lowercase : function() { |
|||
return editormd.toolbarHandlers.lowercase; |
|||
} |
|||
}, |
|||
toolbarCustomIcons : { // using html tag create toolbar icon, unused default <a> tag. |
|||
lowercase : "<a href=\"javascript:;\" title=\"Lowercase\" unselectable=\"on\"><i class=\"fa\" name=\"lowercase\" style=\"font-size:24px;margin-top: -10px;\">a</i></a>", |
|||
"ucwords" : "<a href=\"javascript:;\" title=\"ucwords\" unselectable=\"on\"><i class=\"fa\" name=\"ucwords\" style=\"font-size:20px;margin-top: -3px;\">Aa</i></a>" |
|||
}, |
|||
toolbarIconTexts : {}, |
|||
|
|||
lang : { // Language data, you can custom your language. |
|||
name : "zh-cn", |
|||
description : "开源在线Markdown编辑器<br/>Open source online Markdown editor.", |
|||
tocTitle : "目录", |
|||
toolbar : { |
|||
//... |
|||
}, |
|||
button: { |
|||
//... |
|||
}, |
|||
dialog : { |
|||
//... |
|||
} |
|||
//... |
|||
} |
|||
} |
|||
``` |
|||
|
|||
#### Dependents |
|||
|
|||
- [CodeMirror](http://codemirror.net/ "CodeMirror") |
|||
- [marked](https://github.com/markedjs/marked "marked") |
|||
- [jQuery](http://jquery.com/ "jQuery") |
|||
- [FontAwesome](http://fontawesome.io/ "FontAwesome") |
|||
- [github-markdown.css](https://github.com/sindresorhus/github-markdown-css "github-markdown.css") |
|||
- [KaTeX](http://khan.github.io/KaTeX/ "KaTeX") |
|||
- [prettify.js](http://code.google.com/p/google-code-prettify/ "prettify.js") |
|||
- [Rephael.js](http://raphaeljs.com/ "Rephael.js") |
|||
- [flowchart.js](http://adrai.github.io/flowchart.js/ "flowchart.js") |
|||
- [sequence-diagram.js](http://bramp.github.io/js-sequence-diagrams/ "sequence-diagram.js") |
|||
- [Prefixes.scss](https://github.com/pandao/prefixes.scss "Prefixes.scss") |
|||
|
|||
#### Changes |
|||
|
|||
[Change logs](https://github.com/pandao/editor.md/blob/master/CHANGE.md) |
|||
|
|||
#### License |
|||
|
|||
The MIT License. |
|||
|
|||
Copyright (c) 2015-2019 Pandao |
|||
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,142 +1,142 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="zh"> |
|||
<head> |
|||
<meta charset="utf-8" /> |
|||
<title>HTML Preview(markdown to html) - Editor.md examples</title> |
|||
<link rel="stylesheet" href="css/style.css" /> |
|||
<link rel="stylesheet" href="../css/editormd.preview.css" /> |
|||
<link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon" /> |
|||
<style> |
|||
.editormd-html-preview { |
|||
width: 90%; |
|||
margin: 0 auto; |
|||
} |
|||
</style> |
|||
</head> |
|||
<body> |
|||
<div id="layout"> |
|||
<header> |
|||
<h1>Markdown转HTML的显示处理</h1> |
|||
<p>即：非编辑情况下的HTML预览</p> |
|||
<p>HTML Preview(markdown to html)</p> |
|||
</header> |
|||
<div class="btns"> |
|||
<button onclick="location.href='./html-preview-markdown-to-html-custom-toc-container.html';">将 ToC 移到自定义容器层</button> |
|||
</div> |
|||
<div id="test-editormd-view"> |
|||
<textarea style="display:none;" name="test-editormd-markdown-doc">###Hello world!</textarea> |
|||
</div> |
|||
<div id="test-editormd-view2"> |
|||
<textarea id="append-test" style="display:none;"> |
|||
|
|||
### 科学公式 TeX(KaTeX) |
|||
|
|||
$$E=mc^2$$ |
|||
|
|||
行内的公式$$E=mc^2$$行内的公式，行内的$$E=mc^2$$公式。 |
|||
|
|||
$$\(\sqrt{3x-1}+(1+x)^2\)$$ |
|||
|
|||
$$\sin(\alpha)^{\theta}=\sum_{i=0}^{n}(x^i + \cos(f))$$ |
|||
|
|||
$$X^2 > Y$$ |
|||
|
|||
##### 上标和下标 |
|||
|
|||
上标：X<sup>2</sup> |
|||
|
|||
下标：O<sub>2</sub> |
|||
|
|||
##### 代码块里包含的过滤标签及属性不会被过滤 |
|||
|
|||
```html |
|||
<style type="text/style"> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
<script type="text/javscript"> |
|||
alert("script"); |
|||
</script> |
|||
|
|||
<iframe height=498 width=510 src="http://player.youku.com/embed/XMzA0MzIwMDgw" frameborder=0 allowfullscreen></iframe> |
|||
``` |
|||
|
|||
##### Style |
|||
|
|||
<style> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
<style type="text/style"> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
##### Script |
|||
|
|||
<script> |
|||
alert("script"); |
|||
</script> |
|||
|
|||
<script type="text/javscript"> |
|||
alert("script"); |
|||
</script></textarea> |
|||
</div> |
|||
</div> |
|||
<!-- <script src="js/zepto.min.js"></script> |
|||
<script> |
|||
var jQuery = Zepto; // 为了避免修改flowChart.js和sequence-diagram.js的源码，所以使用Zepto.js时想支持flowChart/sequenceDiagram就得加上这一句 |
|||
</script> --> |
|||
<script src="js/jquery.min.js"></script> |
|||
<script src="../lib/marked.min.js"></script> |
|||
<script src="../lib/prettify.min.js"></script> |
|||
|
|||
<script src="../lib/raphael.min.js"></script> |
|||
<script src="../lib/underscore.min.js"></script> |
|||
<script src="../lib/sequence-diagram.min.js"></script> |
|||
<script src="../lib/flowchart.min.js"></script> |
|||
<script src="../lib/jquery.flowchart.min.js"></script> |
|||
|
|||
<script src="../editormd.js"></script> |
|||
<script type="text/javascript"> |
|||
$(function() { |
|||
var testEditormdView, testEditormdView2; |
|||
|
|||
$.get("test.md", function(markdown) { |
|||
|
|||
testEditormdView = editormd.markdownToHTML("test-editormd-view", { |
|||
markdown : markdown ,//+ "\r\n" + $("#append-test").text(), |
|||
//htmlDecode : true, // 开启 HTML 标签解析，为了安全性，默认不开启 |
|||
htmlDecode : "style,script,iframe", // you can filter tags decode |
|||
//toc : false, |
|||
tocm : true, // Using [TOCM] |
|||
//tocContainer : "#custom-toc-container", // 自定义 ToC 容器层 |
|||
//gfm : false, |
|||
//tocDropdown : true, |
|||
// markdownSourceCode : true, // 是否保留 Markdown 源码，即是否删除保存源码的 Textarea 标签 |
|||
emoji : true, |
|||
taskList : true, |
|||
tex : true, // 默认不解析 |
|||
flowChart : true, // 默认不解析 |
|||
sequenceDiagram : true, // 默认不解析 |
|||
}); |
|||
|
|||
//console.log("返回一个 jQuery 实例 =>", testEditormdView); |
|||
|
|||
// 获取Markdown源码 |
|||
//console.log(testEditormdView.getMarkdown()); |
|||
|
|||
//alert(testEditormdView.getMarkdown()); |
|||
}); |
|||
|
|||
testEditormdView2 = editormd.markdownToHTML("test-editormd-view2", { |
|||
htmlDecode : "style,script,iframe", // you can filter tags decode |
|||
emoji : true, |
|||
taskList : true, |
|||
tex : true, // 默认不解析 |
|||
flowChart : true, // 默认不解析 |
|||
sequenceDiagram : true, // 默认不解析 |
|||
}); |
|||
}); |
|||
</script> |
|||
</body> |
|||
</html> |
|||
<!DOCTYPE html> |
|||
<html lang="zh"> |
|||
<head> |
|||
<meta charset="utf-8" /> |
|||
<title>HTML Preview(markdown to html) - Editor.md examples</title> |
|||
<link rel="stylesheet" href="css/style.css" /> |
|||
<link rel="stylesheet" href="../css/editormd.preview.css" /> |
|||
<link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon" /> |
|||
<style> |
|||
.editormd-html-preview { |
|||
width: 90%; |
|||
margin: 0 auto; |
|||
} |
|||
</style> |
|||
</head> |
|||
<body> |
|||
<div id="layout"> |
|||
<header> |
|||
<h1>Markdown转HTML的显示处理</h1> |
|||
<p>即：非编辑情况下的HTML预览</p> |
|||
<p>HTML Preview(markdown to html)</p> |
|||
</header> |
|||
<div class="btns"> |
|||
<button onclick="location.href='./html-preview-markdown-to-html-custom-toc-container.html';">将 ToC 移到自定义容器层</button> |
|||
</div> |
|||
<div id="test-editormd-view"> |
|||
<textarea style="display:none;" name="test-editormd-markdown-doc">###Hello world!</textarea> |
|||
</div> |
|||
<div id="test-editormd-view2"> |
|||
<textarea id="append-test" style="display:none;"> |
|||
|
|||
### 科学公式 TeX(KaTeX) |
|||
|
|||
$$E=mc^2$$ |
|||
|
|||
行内的公式$$E=mc^2$$行内的公式，行内的$$E=mc^2$$公式。 |
|||
|
|||
$$\(\sqrt{3x-1}+(1+x)^2\)$$ |
|||
|
|||
$$\sin(\alpha)^{\theta}=\sum_{i=0}^{n}(x^i + \cos(f))$$ |
|||
|
|||
$$X^2 > Y$$ |
|||
|
|||
##### 上标和下标 |
|||
|
|||
上标：X<sup>2</sup> |
|||
|
|||
下标：O<sub>2</sub> |
|||
|
|||
##### 代码块里包含的过滤标签及属性不会被过滤 |
|||
|
|||
```html |
|||
<style type="text/style"> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
<script type="text/javscript"> |
|||
alert("script"); |
|||
</script> |
|||
|
|||
<iframe height=498 width=510 src="http://player.youku.com/embed/XMzA0MzIwMDgw" frameborder=0 allowfullscreen></iframe> |
|||
``` |
|||
|
|||
##### Style |
|||
|
|||
<style> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
<style type="text/style"> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
##### Script |
|||
|
|||
<script> |
|||
alert("script"); |
|||
</script> |
|||
|
|||
<script type="text/javscript"> |
|||
alert("script"); |
|||
</script></textarea> |
|||
</div> |
|||
</div> |
|||
<!-- <script src="js/zepto.min.js"></script> |
|||
<script> |
|||
var jQuery = Zepto; // 为了避免修改flowChart.js和sequence-diagram.js的源码，所以使用Zepto.js时想支持flowChart/sequenceDiagram就得加上这一句 |
|||
</script> --> |
|||
<script src="js/jquery.min.js"></script> |
|||
<script src="../lib/marked.min.js"></script> |
|||
<script src="../lib/prettify.min.js"></script> |
|||
|
|||
<script src="../lib/raphael.min.js"></script> |
|||
<script src="../lib/underscore.min.js"></script> |
|||
<script src="../lib/sequence-diagram.min.js"></script> |
|||
<script src="../lib/flowchart.min.js"></script> |
|||
<script src="../lib/jquery.flowchart.min.js"></script> |
|||
|
|||
<script src="../editormd.js"></script> |
|||
<script type="text/javascript"> |
|||
$(function() { |
|||
var testEditormdView, testEditormdView2; |
|||
|
|||
$.get("test.md", function(markdown) { |
|||
|
|||
testEditormdView = editormd.markdownToHTML("test-editormd-view", { |
|||
markdown : markdown ,//+ "\r\n" + $("#append-test").text(), |
|||
//htmlDecode : true, // 开启 HTML 标签解析，为了安全性，默认不开启 |
|||
htmlDecode : "style,script,iframe", // you can filter tags decode |
|||
//toc : false, |
|||
tocm : true, // Using [TOCM] |
|||
//tocContainer : "#custom-toc-container", // 自定义 ToC 容器层 |
|||
//gfm : false, |
|||
//tocDropdown : true, |
|||
// markdownSourceCode : true, // 是否保留 Markdown 源码，即是否删除保存源码的 Textarea 标签 |
|||
emoji : true, |
|||
taskList : true, |
|||
tex : true, // 默认不解析 |
|||
flowChart : true, // 默认不解析 |
|||
sequenceDiagram : true, // 默认不解析 |
|||
}); |
|||
|
|||
//console.log("返回一个 jQuery 实例 =>", testEditormdView); |
|||
|
|||
// 获取Markdown源码 |
|||
//console.log(testEditormdView.getMarkdown()); |
|||
|
|||
//alert(testEditormdView.getMarkdown()); |
|||
}); |
|||
|
|||
testEditormdView2 = editormd.markdownToHTML("test-editormd-view2", { |
|||
htmlDecode : "style,script,iframe", // you can filter tags decode |
|||
emoji : true, |
|||
taskList : true, |
|||
tex : true, // 默认不解析 |
|||
flowChart : true, // 默认不解析 |
|||
sequenceDiagram : true, // 默认不解析 |
|||
}); |
|||
}); |
|||
</script> |
|||
</body> |
|||
</html> |
|||
|
|||
@ -1,119 +1,136 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="zh"> |
|||
<head> |
|||
<meta charset="utf-8" /> |
|||
<title>识别和解析 HTML 标签 - Editor.md examples</title> |
|||
<link rel="stylesheet" href="css/style.css" /> |
|||
<link rel="stylesheet" href="../css/editormd.css" /> |
|||
<link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon" /> |
|||
</head> |
|||
<body> |
|||
<div id="layout"> |
|||
<header> |
|||
<h1>识别和解析HTML标签</h1> |
|||
<p>HTML tags (filter) decode, You can increase safety by filtering the danger label.</p> |
|||
<p>注：虽然此功能能极大地扩展 Markdown 语法，但也面临着安全上的风险，所以默认是不开启的。</p> |
|||
<p>Update: 可以通过设置 `settings.htmlDecode = "style,script,iframe|on*"`来实现过滤指定标签及属性的解析，提高安全性；</p> |
|||
</header> |
|||
<div class="btns"> |
|||
<button class="filter-btn" exp="true">Unfilter</button> |
|||
<button class="filter-btn" exp="style,script,iframe|*">Filter style,script,iframe|*</button> |
|||
<button class="filter-btn" exp="style,script,iframe|on*">Filter style,script,iframe|on*</button> |
|||
<button class="filter-btn" exp="style,script,iframe|onclick,title,onmouseover,onmouseout,style">Filter style,script,iframe|onclick,title,onmouseover,onmouseout,style</button> |
|||
</div> |
|||
<div id="test-editormd"> |
|||
<textarea style="display:none;">#### 开启识别和解析 HTML 标签 |
|||
|
|||
配置项： |
|||
|
|||
{ |
|||
htmlDecode : true // Decode all html tags & attributes |
|||
// Filter tags/attributes expression : tagName,tagName,...|attrName,attrName,... |
|||
htmlDecode : "style,script,iframe,sub,sup|on*" // Filter tags, and all on* attributes |
|||
//htmlDecode : "style,script,iframe,sub,sup|*" // Filter tags, and all attributes |
|||
//htmlDecode : "style,script,iframe,sub,sup,embed|onclick,title,onmouseover,onmouseout,style" // Filter tags, and your custom attributes |
|||
} |
|||
|
|||
#### 示例 |
|||
|
|||
##### 上标和下标 |
|||
|
|||
上标：X<sup>2</sup> |
|||
|
|||
下标：O<sub>2</sub> |
|||
|
|||
##### 代码块里包含的过滤标签及属性不会被过滤 |
|||
|
|||
```html |
|||
<style type="text/style"> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
<script type="text/javscript"> |
|||
alert("script"); |
|||
</script> |
|||
|
|||
<iframe height=498 width=510 src="http://player.youku.com/embed/XMzA0MzIwMDgw" frameborder=0 allowfullscreen></iframe> |
|||
``` |
|||
|
|||
##### Style |
|||
|
|||
<style> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
<style type="text/style"> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
##### Script |
|||
|
|||
<script> |
|||
alert("script"); |
|||
</script> |
|||
|
|||
<script type="text/javscript"> |
|||
alert("script"); |
|||
</script> |
|||
|
|||
##### Events |
|||
|
|||
<div style="color:green;" onclick="alert(1233);" title="div xxxxx">Events</div> |
|||
<div style="color:red;" contenteditable onclick="alert(1233);" onmouseover="alert(1233);" onmouseout="alert(1233);" title="div xxxxx">Events</div> |
|||
|
|||
##### 插入Flash |
|||
|
|||
<embed src="http://player.youku.com/player.php/sid/XMzA0MzIwMDgw/v.swf" allowFullScreen="true" quality="high" width="480" height="400" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash"></embed> |
|||
|
|||
##### 插入视频 |
|||
|
|||
李健《最好不相见》 |
|||
|
|||
<iframe height=498 width=510 src="http://player.youku.com/embed/XMzA0MzIwMDgw" frameborder=0 allowfullscreen></iframe></textarea> |
|||
</div> |
|||
</div> |
|||
|
|||
<script src="js/jquery.min.js"></script> |
|||
<script src="../editormd.js"></script> |
|||
<script type="text/javascript"> |
|||
var testEditor; |
|||
|
|||
$(function() { |
|||
testEditor = editormd("test-editormd", { |
|||
width: "90%", |
|||
height: 720, |
|||
path : '../lib/', |
|||
htmlDecode : true, // Decode all html tags & attributes |
|||
// Expression : tagName,tagName,...|attrName,attrName,... |
|||
//htmlDecode : "style,script,iframe,sub,sup|on*" // Filter tags, and all on* attributes |
|||
//htmlDecode : "style,script,iframe,sub,sup|*" // Filter tags, and all attributes |
|||
//htmlDecode : "style,script,iframe,sub,sup,embed|onclick,title,onmouseover,onmouseout,style" // Filter tags, and your custom attributes |
|||
}); |
|||
|
|||
$(".filter-btn").click(function(){ |
|||
testEditor.config("htmlDecode", $(this).attr("exp")); |
|||
}); |
|||
}); |
|||
</script> |
|||
</body> |
|||
</html> |
|||
<!DOCTYPE html> |
|||
<html lang="zh"> |
|||
<head> |
|||
<meta charset="utf-8" /> |
|||
<title>识别和解析 HTML 标签 - Editor.md examples</title> |
|||
<link rel="stylesheet" href="css/style.css" /> |
|||
<link rel="stylesheet" href="../css/editormd.css" /> |
|||
<link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon" /> |
|||
</head> |
|||
<body> |
|||
<div id="layout"> |
|||
<header> |
|||
<h1>识别和解析HTML标签</h1> |
|||
<p>HTML tags (filter) decode, You can increase safety by filtering the danger label.</p> |
|||
<p>注：虽然此功能能极大地扩展 Markdown 语法，但也面临着安全上的风险，所以默认是不开启的。</p> |
|||
<p>Update: 可以通过设置 `settings.htmlDecode = "style,script,iframe|on*"`来实现过滤指定标签及属性的解析，提高安全性；</p> |
|||
</header> |
|||
<div class="btns"> |
|||
<button class="filter-btn" exp="true">Unfilter</button> |
|||
<button class="filter-btn" exp="style,script,iframe|*">Filter style,script,iframe|*</button> |
|||
<button class="filter-btn" exp="style,script,iframe|on*">Filter style,script,iframe|on*</button> |
|||
<button class="filter-btn" exp="style,script,iframe|onclick,title,onmouseover,onmouseout,style">Filter style,script,iframe|onclick,title,onmouseover,onmouseout,style</button> |
|||
</div> |
|||
<div id="test-editormd"> |
|||
<textarea style="display:none;">[TOC] |
|||
|
|||
#### 开启识别和解析 HTML 标签 |
|||
|
|||
配置项： |
|||
|
|||
{ |
|||
htmlDecode : true // Decode all html tags & attributes |
|||
// Filter tags/attributes expression : tagName,tagName,...|attrName,attrName,... |
|||
htmlDecode : "style,script,iframe,sub,sup|on*" // Filter tags, and all on* attributes |
|||
//htmlDecode : "style,script,iframe,sub,sup|*" // Filter tags, and all attributes |
|||
//htmlDecode : "style,script,iframe,sub,sup,embed|onclick,title,onmouseover,onmouseout,style" // Filter tags, and your custom attributes |
|||
} |
|||
|
|||
#### 示例 |
|||
|
|||
##### 上标和下标 |
|||
|
|||
上标：X<sup>2</sup> |
|||
|
|||
下标：O<sub>2</sub> |
|||
|
|||
##### 代码块里包含的过滤标签及属性不会被过滤 |
|||
|
|||
```html |
|||
<style type="text/style"> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
<script type="text/javscript"> |
|||
alert("script"); |
|||
</script> |
|||
|
|||
<iframe height=498 width=510 src="http://player.youku.com/embed/XMzA0MzIwMDgw" frameborder=0 allowfullscreen></iframe> |
|||
``` |
|||
|
|||
#### **Strong text** Test |
|||
|
|||
##### Image |
|||
|
|||
<img src="http://editor.md.ipandao.com/images/logos/editormd-logo-64x64.png"/> |
|||
|
|||
<a href="https://github.com/pandao/editor.md"><img src="http://editor.md.ipandao.com/images/logos/editormd-logo-64x64.png"/></a> |
|||
|
|||
[](https://github.com/pandao/editor.md) |
|||
|
|||
:sweat_smile: :blush: :smiley: :relaxed: :smile: [:laughing:](https://github.com/pandao/editor.md) |
|||
|
|||
##### Style :sweat_smile: |
|||
|
|||
<style> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
<style type="text/style"> |
|||
body{background:red;} |
|||
</style> |
|||
|
|||
##### Script |
|||
|
|||
<script> |
|||
alert("script"); |
|||
</script> |
|||
|
|||
<script type="text/javscript"> |
|||
alert("script"); |
|||
</script> |
|||
|
|||
<a href="javascript:alert('xss')">a javascript:alert("xss")</a> |
|||
|
|||
##### Events |
|||
|
|||
<div style="color:green;" onclick="alert(1233);" title="div xxxxx">Events</div> |
|||
<div style="color:red;" contenteditable onclick="alert(1233);" onmouseover="alert(1233);" onmouseout="alert(1233);" title="div xxxxx">Events</div> |
|||
|
|||
##### 插入Flash |
|||
|
|||
<embed src="http://player.youku.com/player.php/sid/XMzA0MzIwMDgw/v.swf" allowFullScreen="true" quality="high" width="480" height="400" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash"></embed> |
|||
|
|||
##### 插入视频 |
|||
|
|||
李健《最好不相见》 |
|||
|
|||
<iframe height=498 width=510 src="http://player.youku.com/embed/XMzA0MzIwMDgw" frameborder=0 allowfullscreen></iframe></textarea> |
|||
</div> |
|||
</div> |
|||
|
|||
<script src="js/jquery.min.js"></script> |
|||
<script src="../editormd.js"></script> |
|||
<script type="text/javascript"> |
|||
var testEditor; |
|||
|
|||
$(function() { |
|||
testEditor = editormd("test-editormd", { |
|||
width: "90%", |
|||
height: 720, |
|||
path : '../lib/', |
|||
emoji: true, |
|||
htmlDecode : true, // Decode all html tags & attributes |
|||
// Expression : tagName,tagName,...|attrName,attrName,... |
|||
htmlDecode : "style,script,iframe,sub,sup|on*" // Filter tags, and all on* attributes |
|||
// htmlDecode : "style,script,iframe,sub,sup|*" // Filter tags, and all attributes, TOC not parsing |
|||
//htmlDecode : "style,script,iframe,sub,sup,embed|onclick,title,onmouseover,onmouseout,style" // Filter tags, and your custom attributes |
|||
}); |
|||
|
|||
$(".filter-btn").click(function(){ |
|||
testEditor.config("htmlDecode", $(this).attr("exp")); |
|||
}); |
|||
}); |
|||
</script> |
|||
</body> |
|||
</html> |
|||
|
|||
@ -1,365 +1,367 @@ |
|||
# Editor.md |
|||
|
|||
 |
|||
|
|||
      |
|||
|
|||
**目录 (Table of Contents)** |
|||
|
|||
[TOCM] |
|||
|
|||
[TOC] |
|||
|
|||
# Heading 1 |
|||
## Heading 2 |
|||
### Heading 3 |
|||
#### Heading 4 |
|||
##### Heading 5 |
|||
###### Heading 6 |
|||
# Heading 1 link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
## Heading 2 link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
### Heading 3 link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
#### Heading 4 link [Heading link](https://github.com/pandao/editor.md "Heading link") Heading link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
##### Heading 5 link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
###### Heading 6 link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
|
|||
#### 标题（用底线的形式）Heading (underline) |
|||
|
|||
This is an H1 |
|||
============= |
|||
|
|||
This is an H2 |
|||
------------- |
|||
|
|||
### 字符效果和横线等 |
|||
|
|||
---- |
|||
|
|||
~~删除线~~ <s>删除线（开启识别HTML标签时）</s> |
|||
*斜体字* _斜体字_ |
|||
**粗体** __粗体__ |
|||
***粗斜体*** ___粗斜体___ |
|||
|
|||
上标：X<sub>2</sub>，下标：O<sup>2</sup> |
|||
|
|||
**缩写(同HTML的abbr标签)** |
|||
|
|||
> 即更长的单词或短语的缩写形式，前提是开启识别HTML标签时，已默认开启 |
|||
|
|||
The <abbr title="Hyper Text Markup Language">HTML</abbr> specification is maintained by the <abbr title="World Wide Web Consortium">W3C</abbr>. |
|||
|
|||
### 引用 Blockquotes |
|||
|
|||
> 引用文本 Blockquotes |
|||
|
|||
引用的行内混合 Blockquotes |
|||
|
|||
> 引用：如果想要插入空白换行`即<br />标签`，在插入处先键入两个以上的空格然后回车即可，[普通链接](http://localhost/)。 |
|||
|
|||
### 锚点与链接 Links |
|||
|
|||
[普通链接](http://localhost/) |
|||
|
|||
[普通链接带标题](http://localhost/ "普通链接带标题") |
|||
|
|||
直接链接：<https://github.com> |
|||
|
|||
[锚点链接][anchor-id] |
|||
|
|||
[anchor-id]: http://www.this-anchor-link.com/ |
|||
|
|||
[mailto:test.test@gmail.com](mailto:test.test@gmail.com) |
|||
|
|||
GFM a-tail link @pandao 邮箱地址自动链接 test.test@gmail.com www@vip.qq.com |
|||
|
|||
> @pandao |
|||
|
|||
### 多语言代码高亮 Codes |
|||
|
|||
#### 行内代码 Inline code |
|||
|
|||
执行命令：`npm install marked` |
|||
|
|||
#### 缩进风格 |
|||
|
|||
即缩进四个空格，也做为实现类似 `<pre>` 预格式化文本 ( Preformatted Text ) 的功能。 |
|||
|
|||
<?php |
|||
echo "Hello world!"; |
|||
?> |
|||
|
|||
预格式化文本： |
|||
|
|||
| First Header | Second Header | |
|||
| ------------- | ------------- | |
|||
| Content Cell | Content Cell | |
|||
| Content Cell | Content Cell | |
|||
|
|||
#### JS代码 |
|||
|
|||
```javascript |
|||
function test() { |
|||
console.log("Hello world!"); |
|||
} |
|||
|
|||
(function(){ |
|||
var box = function() { |
|||
return box.fn.init(); |
|||
}; |
|||
|
|||
box.prototype = box.fn = { |
|||
init : function(){ |
|||
console.log('box.init()'); |
|||
|
|||
return this; |
|||
}, |
|||
|
|||
add : function(str) { |
|||
alert("add", str); |
|||
|
|||
return this; |
|||
}, |
|||
|
|||
remove : function(str) { |
|||
alert("remove", str); |
|||
|
|||
return this; |
|||
} |
|||
}; |
|||
|
|||
box.fn.init.prototype = box.fn; |
|||
|
|||
window.box =box; |
|||
})(); |
|||
|
|||
var testBox = box(); |
|||
testBox.add("jQuery").remove("jQuery"); |
|||
``` |
|||
|
|||
#### HTML 代码 HTML codes |
|||
|
|||
```html |
|||
<!DOCTYPE html> |
|||
<html> |
|||
<head> |
|||
<mate charest="utf-8" /> |
|||
<meta name="keywords" content="Editor.md, Markdown, Editor" /> |
|||
<title>Hello world!</title> |
|||
<style type="text/css"> |
|||
body{font-size:14px;color:#444;font-family: "Microsoft Yahei", Tahoma, "Hiragino Sans GB", Arial;background:#fff;} |
|||
ul{list-style: none;} |
|||
img{border:none;vertical-align: middle;} |
|||
</style> |
|||
</head> |
|||
<body> |
|||
<h1 class="text-xxl">Hello world!</h1> |
|||
<p class="text-green">Plain text</p> |
|||
</body> |
|||
</html> |
|||
``` |
|||
|
|||
### 图片 Images |
|||
|
|||
Image: |
|||
|
|||
 |
|||
|
|||
> Follow your heart. |
|||
|
|||
 |
|||
|
|||
> 图为：厦门白城沙滩 |
|||
|
|||
图片加链接 (Image + Link)： |
|||
|
|||
[](https://pandao.github.io/editor.md/images/7.jpg "李健首张专辑《似水流年》封面") |
|||
|
|||
> 图为：李健首张专辑《似水流年》封面 |
|||
|
|||
---- |
|||
|
|||
### 列表 Lists |
|||
|
|||
#### 无序列表（减号）Unordered Lists (-) |
|||
|
|||
- 列表一 |
|||
- 列表二 |
|||
- 列表三 |
|||
|
|||
#### 无序列表（星号）Unordered Lists (*) |
|||
|
|||
* 列表一 |
|||
* 列表二 |
|||
* 列表三 |
|||
|
|||
#### 无序列表（加号和嵌套）Unordered Lists (+) |
|||
|
|||
+ 列表一 |
|||
+ 列表二 |
|||
+ 列表二-1 |
|||
+ 列表二-2 |
|||
+ 列表二-3 |
|||
+ 列表三 |
|||
* 列表一 |
|||
* 列表二 |
|||
* 列表三 |
|||
|
|||
#### 有序列表 Ordered Lists (-) |
|||
|
|||
1. 第一行 |
|||
2. 第二行 |
|||
3. 第三行 |
|||
|
|||
#### GFM task list |
|||
|
|||
- [x] GFM task list 1 |
|||
- [x] GFM task list 2 |
|||
- [ ] GFM task list 3 |
|||
- [ ] GFM task list 3-1 |
|||
- [ ] GFM task list 3-2 |
|||
- [ ] GFM task list 3-3 |
|||
- [ ] GFM task list 4 |
|||
- [ ] GFM task list 4-1 |
|||
- [ ] GFM task list 4-2 |
|||
|
|||
---- |
|||
|
|||
### 绘制表格 Tables |
|||
|
|||
| 项目 | 价格 | 数量 | |
|||
| -------- | -----: | :----: | |
|||
| 计算机 | $1600 | 5 | |
|||
| 手机 | $12 | 12 | |
|||
| 管线 | $1 | 234 | |
|||
|
|||
First Header | Second Header |
|||
------------- | ------------- |
|||
Content Cell | Content Cell |
|||
Content Cell | Content Cell |
|||
|
|||
| First Header | Second Header | |
|||
| ------------- | ------------- | |
|||
| Content Cell | Content Cell | |
|||
| Content Cell | Content Cell | |
|||
|
|||
| Function name | Description | |
|||
| ------------- | ------------------------------ | |
|||
| `help()` | Display the help window. | |
|||
| `destroy()` | **Destroy your computer!** | |
|||
|
|||
| Left-Aligned | Center Aligned | Right Aligned | |
|||
| :------------ |:---------------:| -----:| |
|||
| col 3 is | some wordy text | $1600 | |
|||
| col 2 is | centered | $12 | |
|||
| zebra stripes | are neat | $1 | |
|||
|
|||
| Item | Value | |
|||
| --------- | -----:| |
|||
| Computer | $1600 | |
|||
| Phone | $12 | |
|||
| Pipe | $1 | |
|||
|
|||
---- |
|||
|
|||
#### 特殊符号 HTML Entities Codes |
|||
|
|||
© & ¨ ™ ¡ £ |
|||
& < > ¥ € ® ± ¶ § ¦ ¯ « · |
|||
|
|||
X² Y³ ¾ ¼ × ÷ » |
|||
|
|||
18ºC " ' |
|||
|
|||
[========] |
|||
|
|||
### Emoji表情 :smiley: |
|||
|
|||
> Blockquotes :star: |
|||
|
|||
#### GFM task lists & Emoji & fontAwesome icon emoji & editormd logo emoji :editormd-logo-5x: |
|||
|
|||
- [x] :smiley: @mentions, :smiley: #refs, [links](), **formatting**, and <del>tags</del> supported :editormd-logo:; |
|||
- [x] list syntax required (any unordered or ordered list supported) :editormd-logo-3x:; |
|||
- [x] [ ] :smiley: this is a complete item :smiley:; |
|||
- [ ] []this is an incomplete item [test link](#) :fa-star: @pandao; |
|||
- [ ] [ ]this is an incomplete item :fa-star: :fa-gear:; |
|||
- [ ] :smiley: this is an incomplete item [test link](#) :fa-star: :fa-gear:; |
|||
- [ ] :smiley: this is :fa-star: :fa-gear: an incomplete item [test link](#); |
|||
|
|||
#### 反斜杠 Escape |
|||
|
|||
\*literal asterisks\* |
|||
|
|||
[========] |
|||
|
|||
### 科学公式 TeX(KaTeX) |
|||
|
|||
$$E=mc^2$$ |
|||
|
|||
行内的公式$$E=mc^2$$行内的公式，行内的$$E=mc^2$$公式。 |
|||
|
|||
$$x > y$$ |
|||
|
|||
$$\(\sqrt{3x-1}+(1+x)^2\)$$ |
|||
|
|||
$$\sin(\alpha)^{\theta}=\sum_{i=0}^{n}(x^i + \cos(f))$$ |
|||
|
|||
多行公式： |
|||
|
|||
```math |
|||
\displaystyle |
|||
\left( \sum\_{k=1}^n a\_k b\_k \right)^2 |
|||
\leq |
|||
\left( \sum\_{k=1}^n a\_k^2 \right) |
|||
\left( \sum\_{k=1}^n b\_k^2 \right) |
|||
``` |
|||
|
|||
```katex |
|||
\displaystyle |
|||
\frac{1}{ |
|||
\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{ |
|||
\frac25 \pi}} = 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} { |
|||
1+\frac{e^{-6\pi}} |
|||
{1+\frac{e^{-8\pi}} |
|||
{1+\cdots} } |
|||
} |
|||
} |
|||
``` |
|||
|
|||
```latex |
|||
f(x) = \int_{-\infty}^\infty |
|||
\hat f(\xi)\,e^{2 \pi i \xi x} |
|||
\,d\xi |
|||
``` |
|||
|
|||
### 分页符 Page break |
|||
|
|||
> Print Test: Ctrl + P |
|||
|
|||
[========] |
|||
|
|||
### 绘制流程图 Flowchart |
|||
|
|||
```flow |
|||
st=>start: 用户登陆 |
|||
op=>operation: 登陆操作 |
|||
cond=>condition: 登陆成功 Yes or No? |
|||
e=>end: 进入后台 |
|||
|
|||
st->op->cond |
|||
cond(yes)->e |
|||
cond(no)->op |
|||
``` |
|||
|
|||
[========] |
|||
|
|||
### 绘制序列图 Sequence Diagram |
|||
|
|||
```seq |
|||
Andrew->China: Says Hello |
|||
Note right of China: China thinks\nabout it |
|||
China-->Andrew: How are you? |
|||
Andrew->>China: I am good thanks! |
|||
``` |
|||
|
|||
### End |
|||
# Editor.md |
|||
|
|||
 |
|||
|
|||
      |
|||
|
|||
**目录 (Table of Contents)** |
|||
|
|||
[TOCM] |
|||
|
|||
[TOC] |
|||
|
|||
# Heading 1 |
|||
## Heading 2 |
|||
### Heading 3 |
|||
#### Heading 4 |
|||
##### Heading 5 |
|||
###### Heading 6 |
|||
# Heading 1 link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
## Heading 2 link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
### Heading 3 link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
#### Heading 4 link [Heading link](https://github.com/pandao/editor.md "Heading link") Heading link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
##### Heading 5 link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
###### Heading 6 link [Heading link](https://github.com/pandao/editor.md "Heading link") |
|||
|
|||
#### 标题（用底线的形式）Heading (underline) |
|||
|
|||
This is an H1 |
|||
============= |
|||
|
|||
This is an H2 |
|||
------------- |
|||
|
|||
### 字符效果和横线等 |
|||
|
|||
---- |
|||
|
|||
~~删除线~~ <s>删除线（开启识别HTML标签时）</s> |
|||
*斜体字* _斜体字_ |
|||
**粗体** __粗体__ |
|||
***粗斜体*** ___粗斜体___ |
|||
|
|||
上标：X<sub>2</sub>，下标：O<sup>2</sup> |
|||
|
|||
**缩写(同HTML的abbr标签)** |
|||
|
|||
> 即更长的单词或短语的缩写形式，前提是开启识别HTML标签时，已默认开启 |
|||
|
|||
The <abbr title="Hyper Text Markup Language">HTML</abbr> specification is maintained by the <abbr title="World Wide Web Consortium">W3C</abbr>. |
|||
|
|||
### 引用 Blockquotes |
|||
|
|||
> 引用文本 Blockquotes |
|||
|
|||
引用的行内混合 Blockquotes |
|||
|
|||
> 引用：如果想要插入空白换行`即<br />标签`，在插入处先键入两个以上的空格然后回车即可，[普通链接](http://localhost/)。 |
|||
|
|||
### 锚点与链接 Links |
|||
|
|||
[普通链接](http://localhost/) |
|||
|
|||
[普通链接带标题](http://localhost/ "普通链接带标题") |
|||
|
|||
直接链接：<https://github.com> |
|||
|
|||
[锚点链接][anchor-id] |
|||
|
|||
[anchor-id]: http://www.this-anchor-link.com/ |
|||
|
|||
[mailto:test.test@gmail.com](mailto:test.test@gmail.com) |
|||
|
|||
GFM a-tail link @pandao 邮箱地址自动链接 test.test@gmail.com www@vip.qq.com |
|||
|
|||
> @pandao |
|||
|
|||
### 多语言代码高亮 Codes |
|||
|
|||
#### 行内代码 Inline code |
|||
|
|||
执行命令：`npm install marked` |
|||
|
|||
#### 缩进风格 |
|||
|
|||
即缩进四个空格，也做为实现类似 `<pre>` 预格式化文本 ( Preformatted Text ) 的功能。 |
|||
|
|||
<?php |
|||
echo "Hello world!"; |
|||
?> |
|||
|
|||
预格式化文本： |
|||
|
|||
| First Header | Second Header | |
|||
| ------------- | ------------- | |
|||
| Content Cell | Content Cell | |
|||
| Content Cell | Content Cell | |
|||
|
|||
#### JS代码 |
|||
|
|||
```javascript |
|||
function test() { |
|||
console.log("Hello world!"); |
|||
} |
|||
|
|||
(function(){ |
|||
var box = function() { |
|||
return box.fn.init(); |
|||
}; |
|||
|
|||
box.prototype = box.fn = { |
|||
init : function(){ |
|||
console.log('box.init()'); |
|||
|
|||
return this; |
|||
}, |
|||
|
|||
add : function(str) { |
|||
alert("add", str); |
|||
|
|||
return this; |
|||
}, |
|||
|
|||
remove : function(str) { |
|||
alert("remove", str); |
|||
|
|||
return this; |
|||
} |
|||
}; |
|||
|
|||
box.fn.init.prototype = box.fn; |
|||
|
|||
window.box =box; |
|||
})(); |
|||
|
|||
var testBox = box(); |
|||
testBox.add("jQuery").remove("jQuery"); |
|||
``` |
|||
|
|||
#### HTML 代码 HTML codes |
|||
|
|||
```html |
|||
<!DOCTYPE html> |
|||
<html> |
|||
<head> |
|||
<mate charest="utf-8" /> |
|||
<meta name="keywords" content="Editor.md, Markdown, Editor" /> |
|||
<title>Hello world!</title> |
|||
<style type="text/css"> |
|||
body{font-size:14px;color:#444;font-family: "Microsoft Yahei", Tahoma, "Hiragino Sans GB", Arial;background:#fff;} |
|||
ul{list-style: none;} |
|||
img{border:none;vertical-align: middle;} |
|||
</style> |
|||
</head> |
|||
<body> |
|||
<h1 class="text-xxl">Hello world!</h1> |
|||
<p class="text-green">Plain text</p> |
|||
</body> |
|||
</html> |
|||
``` |
|||
|
|||
### 图片 Images |
|||
|
|||
Image: |
|||
|
|||
 |
|||
|
|||
> Follow your heart. |
|||
|
|||
 |
|||
|
|||
> 图为：厦门白城沙滩 |
|||
|
|||
图片加链接 (Image + Link)： |
|||
|
|||
[](https://pandao.github.io/editor.md/images/7.jpg "李健首张专辑《似水流年》封面") |
|||
|
|||
> 图为：李健首张专辑《似水流年》封面 |
|||
|
|||
---- |
|||
|
|||
### 列表 Lists |
|||
|
|||
#### 无序列表（减号）Unordered Lists (-) |
|||
|
|||
- 列表一 |
|||
- 列表二 |
|||
- 列表三 |
|||
|
|||
#### 无序列表（星号）Unordered Lists (*) |
|||
|
|||
* 列表一 |
|||
* 列表二 |
|||
* 列表三 |
|||
|
|||
#### 无序列表（加号和嵌套）Unordered Lists (+) |
|||
|
|||
+ 列表一 |
|||
+ 列表二 |
|||
+ 列表二-1 |
|||
+ 列表二-2 |
|||
+ 列表二-3 |
|||
+ 列表三 |
|||
* 列表一 |
|||
* 列表二 |
|||
* 列表三 |
|||
|
|||
#### 有序列表 Ordered Lists (-) |
|||
|
|||
1. 第一行 |
|||
2. 第二行 |
|||
3. 第三行 |
|||
|
|||
#### GFM task list |
|||
|
|||
- [x] GFM task list 1 |
|||
- [x] GFM task list 2 |
|||
- [ ] GFM task list 3 |
|||
- [ ] GFM task list 3-1 |
|||
- [ ] GFM task list 3-2 |
|||
- [ ] GFM task list 3-3 |
|||
- [ ] GFM task list 4 |
|||
- [ ] GFM task list 4-1 |
|||
- [ ] GFM task list 4-2 |
|||
|
|||
---- |
|||
|
|||
### 绘制表格 Tables |
|||
|
|||
| 项目 | 价格 | 数量 | |
|||
| -------- | -----: | :----: | |
|||
| 计算机 | $1600 | 5 | |
|||
| 手机 | $12 | 12 | |
|||
| 管线 | $1 | 234 | |
|||
|
|||
First Header | Second Header |
|||
------------- | ------------- |
|||
Content Cell | Content Cell |
|||
Content Cell | Content Cell |
|||
|
|||
| First Header | Second Header | |
|||
| ------------- | ------------- | |
|||
| Content Cell | Content Cell | |
|||
| Content Cell | Content Cell | |
|||
|
|||
| Function name | Description | |
|||
| ------------- | ------------------------------ | |
|||
| `help()` | Display the help window. | |
|||
| `destroy()` | **Destroy your computer!** | |
|||
|
|||
| Left-Aligned | Center Aligned | Right Aligned | |
|||
| :------------ |:---------------:| -----:| |
|||
| col 3 is | some wordy text | $1600 | |
|||
| col 2 is | centered | $12 | |
|||
| zebra stripes | are neat | $1 | |
|||
|
|||
| Item | Value | |
|||
| --------- | -----:| |
|||
| Computer | $1600 | |
|||
| Phone | $12 | |
|||
| Pipe | $1 | |
|||
|
|||
---- |
|||
|
|||
#### 特殊符号 HTML Entities Codes |
|||
|
|||
© & ¨ ™ ¡ £ |
|||
& < > ¥ € ® ± ¶ § ¦ ¯ « · |
|||
|
|||
X² Y³ ¾ ¼ × ÷ » |
|||
|
|||
18ºC " ' |
|||
|
|||
#### **简要描述** |
|||
|
|||
[========] |
|||
|
|||
### Emoji表情 :smiley: |
|||
|
|||
> Blockquotes :star: |
|||
|
|||
#### GFM task lists & Emoji & fontAwesome icon emoji & editormd logo emoji :editormd-logo-2x: |
|||
|
|||
- [x] :smiley: @mentions, :smiley: #refs, [links](), **formatting**, and <del>tags</del> supported :editormd-logo:; |
|||
- [x] list syntax required (any unordered or ordered list supported) :editormd-logo-3x:; |
|||
- [x] [ ] :smiley: this is a complete item :smiley:; |
|||
- [ ] []this is an incomplete item [test link](#) :fa-star: @pandao; |
|||
- [ ] [ ]this is an incomplete item :fa-star: :fa-gear:; |
|||
- [ ] :smiley: this is an incomplete item [test link](#) :fa-star: :fa-gear:; |
|||
- [ ] :smiley: this is :fa-star: :fa-gear: an incomplete item [test link](#); |
|||
|
|||
#### 反斜杠 Escape |
|||
|
|||
\*literal asterisks\* |
|||
|
|||
[========] |
|||
|
|||
### 科学公式 TeX(KaTeX) |
|||
|
|||
$$E=mc^2$$ |
|||
|
|||
行内的公式$$E=mc^2$$行内的公式，行内的$$E=mc^2$$公式。 |
|||
|
|||
$$x > y$$ |
|||
|
|||
$$\(\sqrt{3x-1}+(1+x)^2\)$$ |
|||
|
|||
$$\sin(\alpha)^{\theta}=\sum_{i=0}^{n}(x^i + \cos(f))$$ |
|||
|
|||
多行公式： |
|||
|
|||
```math |
|||
\displaystyle |
|||
\left( \sum\_{k=1}^n a\_k b\_k \right)^2 |
|||
\leq |
|||
\left( \sum\_{k=1}^n a\_k^2 \right) |
|||
\left( \sum\_{k=1}^n b\_k^2 \right) |
|||
``` |
|||
|
|||
```katex |
|||
\displaystyle |
|||
\frac{1}{ |
|||
\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{ |
|||
\frac25 \pi}} = 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} { |
|||
1+\frac{e^{-6\pi}} |
|||
{1+\frac{e^{-8\pi}} |
|||
{1+\cdots} } |
|||
} |
|||
} |
|||
``` |
|||
|
|||
```latex |
|||
f(x) = \int_{-\infty}^\infty |
|||
\hat f(\xi)\,e^{2 \pi i \xi x} |
|||
\,d\xi |
|||
``` |
|||
|
|||
### 分页符 Page break |
|||
|
|||
> Print Test: Ctrl + P |
|||
|
|||
[========] |
|||
|
|||
### 绘制流程图 Flowchart |
|||
|
|||
```flow |
|||
st=>start: 用户登陆 |
|||
op=>operation: 登陆操作 |
|||
cond=>condition: 登陆成功 Yes or No? |
|||
e=>end: 进入后台 |
|||
|
|||
st->op->cond |
|||
cond(yes)->e |
|||
cond(no)->op |
|||
``` |
|||
|
|||
[========] |
|||
|
|||
### 绘制序列图 Sequence Diagram |
|||
|
|||
```seq |
|||
Andrew->China: Says Hello |
|||
Note right of China: China thinks\nabout it |
|||
China-->Andrew: How are you? |
|||
Andrew->>China: I am good thanks! |
|||
``` |
|||
|
|||
### End |
|||
|
|||
File diff suppressed because one or more lines are too long
Loading…
Reference in new issue