首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何使用showdown.js将表格文本打印到md表?

如何使用showdown.js将表格文本打印到md表?
EN

Stack Overflow用户
提问于 2019-05-29 16:56:26
回答 1查看 402关注 0票数 1

我想用showdown.js打印md表。但是,它似乎没有像我预期的那样正确地转换为标签表。

我尝试将选项(‘table option')设置为'true’,并将文本转换为md。但是,不起作用。

下面是我实现的函数,供您参考。

setMdConvert() <=正如我所说的,我只是尝试了所有的选项。

getTechDescriptionMd() <=用于将任意标记文本转换为标记表格的测试函数

代码语言:javascript
复制
function setMdConvert() {
    var mdConverter = new showdown.Converter();
    var options = showdown.getOptions();
    var keys = Object.keys(options);

    keys.forEach((key) => {
        if(options[key].constructor === boolConstructor)
            mdConverter.setOption(key, true);
    });

    console.log(mdConverter.getOptions());

    return mdConverter;
}

function getTechDescriptionMd() {
    var text = '| h1    |    h2   |      h3 |' +
               '|:------|:-------:|--------:|' +
               '| 100   | [a][1]  | ![b][2] |' +
               '| *foo* | **bar** | ~~baz~~ |';
    var html = mdConverter.makeHtml(text);

    $('.desc-viewer').html(html);
}

结果:

代码语言:javascript
复制
| h1 | h2 | h3 ||:------|:-------:|--------:|| 100 | [a][1] | ![b][2] || foo | bar | baz |

还有没有其他我会错过的选项?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-05-31 02:21:29

这是一个适用于我的.getTechDescriptionMd()的修改版本。我添加了我在昨天的评论中已经提到的换行符,另外我初始化了mdConverter并将其选项'tables‘设置为true (受documentation的启发)。

现在看起来是这样的:

代码语言:javascript
复制
function getTechDescriptionMd() {
    var text = '| h1    |    h2   |      h3 |\n' +
               '|:------|:-------:|--------:|\n' +
               '| 100   | [a][1]  | ![b][2] |\n' +
               '| *foo* | **bar** | ~~baz~~ |';

    var mdConverter = new showdown.Converter();
    mdConverter.setOption('tables', true);
    var html = mdConverter.makeHtml(text);
    $('.desc-viewer').html(html);
}

我得到的结果是:

代码语言:javascript
复制
<table>
<thead>
<tr>
<th style="text-align:left;">h1</th>
<th style="text-align:center;">h2</th>
<th style="text-align:right;">h3</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:left;">100</td>
<td style="text-align:center;">[a][1]</td>
<td style="text-align:right;">![b][2]</td>
</tr>
<tr>
<td style="text-align:left;"><em>foo</em></td>
<td style="text-align:center;"><strong>bar</strong></td>
<td style="text-align:right;">~~baz~~</td>
</tr>
</tbody>
</table>
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/56356702

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档