您的位置：首页 > Web前端 > HTML

CommonMark 使用教程：将 Markdown 语法转成 Html

2019-06-20 14:58 1476 查看

Markdown写作

从 2016年开始写博客，我的写作方式一直在改变，准确的说一直在进步，因为效率越来越高。

最初在 CSDN 上写东西时非常蹩脚，在他们编辑器上写点然后调整格式，再写，碰到图片还得将图片插入进去，调整图片大小位置等等，调整完继续写。

效率非常低。

后面了解到 Markdown ，改用 MD 写东西，效率快很多。后面在 Markdown 基础上慢慢优化找到自己的写作方式。

一般我用 MD 语法写完后，得到的是一堆带 MD 符号的文字，以下简称 MD文本。

然后会通过工具转成对应 Html 标记文本，复制到博客编辑框中，这就是最后显示的文章。

到这一步不知道大家发现没，假设我们能通过代码将 MD文本转成对应的 Html文本，这样只要我们能获取到文章的 MD文本，也就获取到文章的最后显示。

如果我们要做一个自动生产文章的网站，只剩下一步，如何自动不断的获取 MD文本，接着就能不断转成对应文章，然后发布。如果对于全是以内容为主的网站当然没办法不断获取 MD文本，毕竟内容为主，很多东西都不固定。

但如果网站是下载站呢？下载站主要是提供文件下载，内容只是对文件的简单介绍，基本就是百度百科内容，整个文章其实已经固定，有一定规律，这样是有可能会不断获取 MD文本。

以上内容都是在说明 CommonMark的重要性。

CommonMark

使用起来很简单。这里我主要介绍操作其中一些标签的方法，大家可以举一反三，自定义其他各种标签。这里我举例两个标签的自定义：图片，超链接。

因为 CommonMark 默认转成的 Html 是不会带图片大小和位置的。
超链接也是，默认转成后点击链接会在本网页跳转到超链接网页，我希望的效果是点击超链接后，会在浏览器另开一个网页打开。这样对网站的留存率会好点吧。

Maven依赖

<dependency>
<groupId>com.atlassian.commonmark</groupId>
<artifactId>commonmark</artifactId>
<version>0.11.0</version>
</dependency>

自定义标签属性操作类

static class PAttributeProvider implements AttributeProvider {
@Override
public void setAttributes(Node node, String tagName, Map<String, String> attributes) {
if (node instanceof Image) {
attributes.put("style", "width:150px;height:200px;position:relative;left:50%;margin-left:-100px;");
}
if(node instanceof Link){
attributes.put("target", "_blank");
}
}
}

如上我操作了两个标签：Image 和 Link，分别在标签中加了一些属性。这里我只是举例，不一定要跟着这样操作，不操作标签也行。

这一步的目的是为了说明有这个方法而已。

markdown转成html

Parser parser = Parser.builder().build();
Node document = parser.parse(md);
HtmlRenderer renderer = HtmlRenderer.builder().
attributeProviderFactory(new AttributeProviderFactory() {
@Override
public AttributeProvider create(AttributeProviderContext attributeProviderContext) {
return new PAttributeProvider();
}
}).
build();
String mdHtml = renderer.render(document);

ok，已经转成 html 了，方法使用就是这么简单。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： commonmark markdown html

相关文章推荐

新的分享

章节导航