用于修改html的Showdown.js扩展

Question

在another SO question on this topic的帮助下，我尝试了一个在html上不起作用的Showdown.js扩展(如果我只想替换文本，但我想修改html，它可以很好地工作)。

我想改变

<img src="/path/to/image/image1.jpg" alt="bloo bap" title="" />
<img src="/path/to/image/image2.jpg" alt="shoo ba doo" title="" />

至

<img class="foo" src="/path/to/image/image1.jpg" alt="bloo bap" title="" />
<img class="foo" src="/path/to/image/image2.jpg" alt="shoo ba doo" title="" />

我的分机是

var demo = function(converter) {
    return [
        {
            type    : 'lang', 
            regex   : '<img src=(.*)\/>', 
            replace : '<img class="foo" src=$1>'
        }
    ];
}

var converter = new Showdown.converter({extensions: [demo]});

但是没有雪茄。

Answer 1

Showdown extensions在html上工作。试试这个：

type: 'html',
regex: '<img src=(.*)\/>',
replace: '<img class="foo" src=$1>'

Answer 2

有点晚了，但对于那些通过谷歌来这里的人来说：

您需要的是output扩展，而不是lang扩展。

这是一个lang扩展。它将指向.md文件的链接替换为指向.html文件的链接，这是标记代码的第一步

return [
    {
        type    : 'lang', 
        regex   : /\[(.*)\]\((.*)\.md\)/g, 
        replace : '[$1]($2.html)'
    }
];

这是一个输出扩展。它将一个类属性添加到所有图像中，这是生成所有HTML 后的最后一步

return [
    {
        type    : 'output', 
        regex   : '<img (.*)/>', 
        replace : '<img class="foo" $1>'
    }
];

详情在这里：https://github.com/showdownjs/showdown/wiki/extensions

Answer 3

根据我的测试，我认为Showdown扩展只适用于文本，而不适用于html。也就是说，在Showdown接管之前调用扩展。我没有创建扩展，而是使用了以下代码，它的工作方式非常出色

var postProcess = function(text) {
    return text.replace(/<img src=(.*)\/>/g, '<img class="foo" src=$1>');
}

postProcess(converter.makeHtml(text));