`
JerryWang_SAP
  • 浏览: 1001882 次
  • 性别: Icon_minigender_1
  • 来自: 成都
文章分类
社区版块
存档分类
最新评论

推荐一个markdown格式转html格式的开源JavaScript库

阅读更多

这个markdown格式转html格式的开源JavaScript库在github上的地址:

https://github.com/millerblack/markdown-js

从markdown 格式转成html源代码格式

新建一个以js结尾的文件,将下列内容粘贴进去:

var markdown = require( "markdown" ).markdown;

console.log( markdown.toHTML( "Hello *World*!" ) );
 

用nodejs执行,可以看到markdown格式的字符串:

Hello World!

被自动转换成了html格式的字符串:

<p>Hello <em>World</em>!</p>

 

除了nodejs以外,我们还可以在浏览器里使用这个开源库。

新建一个html,将下列源码粘贴进去:

<!DOCTYPE html>

<html>

<body>

<textarea id="text-input" oninput="this.editor.update()"

rows="6" cols="60">Type **Markdown** here.</textarea>

<div id="preview"> </div>

<script src="../node_modules/markdown/lib/markdown.js"></script>

<script>

function Editor(input, preview) {

this.update = function () {

preview.innerHTML = markdown.toHTML(input.value);

};

input.editor = this;

this.update();

}

var $ = function (id) { return document.getElementById(id); };

new Editor($("text-input"), $("preview"));

</script>

</body>

</html>
 

用浏览器打开这个html,在顶部输入框里输入markdown代码后,能自动调用这个开源库,转换成html源代码,然后赋给innerHTML, 这样我们在UI上能看到实时的markdown代码转html代码的结果。

 

要获取更多Jerry的原创文章,请关注公众号"汪子熙":

 
0
0
分享到:
评论

相关推荐

    前端开源库-markdown-it-highlightjs

    Markdown-it-HighlightJS是一个前端开源库,它整合了Markdown解析器markdown-it与代码高亮插件Highlight.js,为开发者提供了在网页上展示格式优美、色彩醒目的代码块的功能。这个库广泛应用于博客、文档网站、论坛等...

    Turndown用JavaScript编写的HTML到Markdown转换器

    Turndown是由Dominic Christie开发的一个开源项目,其目标是提供一个易于使用的库,能够将HTML文档转换为Markdown格式。这个库基于`html-to-markdown`,并在其基础上进行了优化和扩展,支持更多的HTML元素和属性转换...

    前端开源库-jstransformer-markdown

    JSTransformer是一个强大的前端JavaScript转换库,它允许开发者将不同的源代码格式转换成另一种可处理的格式。在这个特定的案例中,我们关注的是`jstransformer-markdown`,一个专门用于处理Markdown语法的模块。...

    Node.js-Raneto是一个开源的知识库平台它使用静态的Markdown文件来为知识库提供支持

    Node.js-Raneto是一个优秀的开源解决方案,它致力于为用户提供一个基于Markdown的静态知识库平台。让我们深入了解一下这个强大的工具及其功能。 **一、Raneto概述** Raneto是一个轻量级、易于部署的系统,它利用...

    渲染markdown内容的HTML元素

    例如,`mikeal-markdown-element-aace454`可能是一个开源项目,专注于Markdown元素的渲染。在项目中,开发者可能实现了自定义的Markdown解析器,对默认的HTML元素渲染进行了扩展,如添加额外的CSS样式、支持表格、...

    前端开源库-medium-editor-markdown

    "前端开源库-medium-editor-markdown"是一个专为前端开发者设计的开源项目,旨在提供一个具有Markdown支持的中等编辑器扩展。 首先,我们要理解什么是`Medium Editor`。Medium Editor是一款基于JavaScript的富文本...

    前端开源库-markdown-it-math

    Markdown-it-Math是一款专为前端开发者设计的开源库,它扩展了Markdown解析器的功能,使得在Markdown格式的文档中插入数学公式变得轻而易举。这个库尤其适用于那些需要在博客、文档或教程中频繁使用数学表达式的项目...

    前端开源库-marky-markdown

    **标题解析:**"前端开源库-marky-markdown"表明我们关注的是一个名为"marky-markdown"的前端开源库,它的主要功能是处理Markdown语言,可能是用于将Markdown格式的文本解析成HTML。 **描述详解:**"marky-markdown...

    基于Rangine(软擎框架)的一款开源Markdown文档系统-前端.zip

    本项目以Rangine(软擎框架)为基础,构建了一款开源的Markdown文档系统,旨在提供一个便捷、高效且易于维护的平台,用于组织和展示各种技术文档或教程。本文将深入探讨该系统的前端部分,结合PHP、MySQL以及源码...

    前端开源库-markdown-it-checkbox

    然后在你的JavaScript代码中引入这两个库,并配置Markdown-it解析器以包含Checkbox插件: ```javascript const md = require('markdown-it')(); const markdownItCheckbox = require('markdown-it-checkbox'); md....

    Node.js-爬取掘金小册并将html文件转为markdown格式文件

    在这个项目中,开发者使用Node.js作为主要开发工具,通过HTTP工具模块来抓取掘金小册(一个在线技术分享平台)上的内容,并将抓取到的HTML文件转换成Markdown格式,便于阅读和分享。 Node.js是基于Chrome V8引擎的...

    前端开源库-markdown-it-prism

    Markdown-it-prism是基于Markdown-it,一个轻量级且高度可扩展的Markdown解析器,通过插件方式将Prism的功能集成进来,使得开发者在生成网页时可以轻松地对代码片段进行格式化和美化。 首先,我们需要了解Markdown-...

    前端开源库-grunt-markdown

    “前端开源”表明grunt-markdown是一个开放源代码的项目,这意味着任何开发者都可以查看其源代码,学习其内部工作原理,甚至根据自己的需求进行定制和改进。开源软件通常有活跃的社区支持,用户可以通过提交问题、...

    前端开源库-parcel-plugin-markdown-string

    "parcel-plugin-markdown-string"就是一个这样的开源库,专为前端开发者设计,旨在简化和优化开发流程。这个库是一个Parcel插件,Parcel是当前流行的零配置Web应用打包工具,它能够自动处理依赖,让你专注于编写代码...

    Remarkjs 是一个 JavaScript 库,利用它,你可以使用 Markdown 格式来制作幻灯片。

    Remarkjs 是一个基于 JavaScript 的开源库,它允许用户利用 Markdown 语法直接创建动态、响应式的幻灯片,极大地简化了创建专业演示文稿的过程。 ### 1. Remarkjs 基础 - **安装与引入**: 在 HTML 文件中,你可以...

    前端开源库-markdown-it-expand-tabs

    Markdown-it是一个流行的、可扩展的JavaScript库,用于将Markdown语法转换为HTML。它提供了丰富的API和一系列插件,使得开发者可以根据需求自定义Markdown的解析规则。Markdown-it-Expand-Tabs正是利用了这一特性,...

    前端开源库-markdown-it-include

    Markdown-it-Include是一款针对前端开发者的开源库,它是Markdown-it解析器的一个插件。Markdown-it是一个流行的、可扩展的Markdown解析器,旨在速度与准确度之间取得平衡,同时支持多种自定义规则。Markdown-it-...

    前端开源库-grunt-jsdoc-to-markdown

    `grunt-jsdoc-to-markdown`是一个非常实用的前端开发工具,主要用于将JavaScript代码中的JSDoc注释转换为Markdown格式的API文档,特别适合那些托管在GitHub上的项目。Markdown格式的文档不仅易于阅读,也方便在...

    前端开源库-doxdox-plugin-markdown

    【前端开源库-doxdox-plugin-markdown】是一款专为前端开发者设计的开源库,它主要功能是增强DoxBox的文档生成能力,通过提供Markdown模板插件来帮助开发者更方便地处理和展示代码注释。DoxBox是一款用于解析...

    前端开源库-markdown-it-lazy-headers

    Markdown-it-Lazy-Headers是前端开发领域的一个开源库,专门针对Markdown解析器Markdown-it设计的一款插件。这个插件的主要功能是实现"懒惰式"的ATX风格标题处理,也就是所谓的"Lazy ATX Headers"。在Markdown语法中...

Global site tag (gtag.js) - Google Analytics