如何将我的降价包裹在HTML Div中？

Question

我正在使用标记 github风味的降价。

我有一些工作的降级：

## Test heading
a paragraph.
## second heading
another paragraph

创建的：

<h2 id="test-heading">Test heading</h2>
<p>a paragraph.</p>
<h2 id="second-heading">second heading</h2>
<p>another paragraph</p>

我想在Div中包装该降价部分，例如：

<div class="blog-post">
## Test heading
a paragraph.
## second heading
another paragraph
</div>

但是，这返回以下html：

<div class="blog-post">
## Test heading
a paragraph.
## second heading
another paragraph
</div>

例如，没有降压，字面上的“ ## test标题”出现在html中。

我如何在Div中正确包裹我的降价？

我找到了以下解决方法，但是它很丑陋，而不是实际的解决方案：

<div class="blog-post">
<div></div>

## Test heading
a paragraph.
## second heading
another paragraph

</div>

Answer 1

Markdown

的Markdown，这是设计。来自 inline html html markdown参考的部分：

请注意，在块级HTML标签中未处理标记格式化语法。例如，您不能在HTML块内使用Markdown风格的强调

但是明确允许使用跨度级标签：

与块级html标签不同，在跨级标签中处理了标记语法。

因此，根据您的用例，您可能会使用span而不是div。

commark

如果您使用的库，则使用inmentness commonmark ，您很幸运。示例 108 and 109 表明，如果您在HTML块和Markdown代码之间保持空线，则内容将被解释为Markdown：

<div>

*Emphasized* text.

</div>

应该使用：虽然以下内容不应：

<div>
*Emphasized* text.
</div>

并且，根据参考文献中的同一部分，某些实现在HTML标签上识别一个附加的markdown = 1属性，以启用其内部分析的分析。

虽然它似乎在Stackoverflow中还没有用：

Testing **Markdown** inside a red-background div.

Answer 2

github页面支持markdown =“ 1”属性属于html元素内的分析降价，例如

<div class="tip" markdown="1">Have **fun!**</div>

注意：截至2019/03起，这在github.com上不起作用，只有github页面。

注意：引用，如markdown =“ 1”，HTML5不需要，但是如果您不使用引号（markdown = 1） ），github不将其识别为HTML。另外，支持现在是越野车。如果您的HTML元素大于单个段落，则可能会获得不正确的输出。例如，由于错误，我无法将降价列表嵌入DIV中。

如果您在markdown =“ 1”不起作用的环境中发现自己，但span确实如此，另一个选项是使用＆lt; span style =”显示：block“＆gt;，因此块级类别与之兼容，例如

<span style="display:block" class="note">It **works!**</span>

提示： ＆lt; span class =“ note” /code>比＆lt; div class =“ note” markdown =“ 1”＆gt;＆lt;/div＆gt;，因此，如果您控制CSS，则可能更喜欢使用＆lt;跨度＆gt;并添加显示：block; to css。

Answer 3

需要额外的额外额外的时间才能在HTML块内进行降级格式化作品，请检查此处所述的文档 - ＆gt; https://michelf.ca/projects/php-markdown/php-markdown/extra/

Markdown额外
任何块级标签。您可以通过将降价属性添加到
带有值1的标签 - 给出markdown =“ 1”

Answer 4

最后一个度假胜地选项：

某些库可能对案例敏感。

尝试＆lt; div＆gt;，而不是＆lt; div＆gt;，看看会发生什么。

MarkdownSharp具有此特征 - 尽管在Stackoverflow上它们无论如何都会剥离所有Divs，因此不要指望它在这里工作。

Answer 5

在我的情况下（在GitHub上），当我在HTML标签和Markdown Text之间添加Newline时，解决了问题。

Answer 6

通过查看扩展标记的并修改html < html <渲染器方法，您可以执行类似的操作以用解析的降价替换标签之间的零件。我没有进行大量测试，但它可以与我的第几次尝试一起使用。

const marked = require('marked');
const renderer = new marked.Renderer();
renderer.html = (mixedContent) => mixedContent.replace(/[^<>]+?(?=<)/g, (match) => {
    const tokens = marked.lexer(match);
    return marked.parser(tokens);
});

---

编辑

此新的正则表达式将确保仅使用IT和HTML标签之间的线条进行降压。

const marked = require('marked');
const renderer = new marked.Renderer();
renderer.html = (mixedContent) => mixedContent.replace(/\n\n[^<>]+?\n\n(?=<)/g, (match) => {
    const tokens = marked.lexer(match);
    return marked.parser(tokens);
});