如何使用包装在div中的Redcarpet在markdown中渲染```代码块？

Question

如果我有这样的降价:

# A Header

``` javascript
$(document).ready(function() {})
```

它将呈现如下:

<h1>A Header</h1>

<pre><code class="javascript">$(document).ready(function() {})</code></pre>

问题是,我希望将这些三反斜杠代码块编译为HTML 时将它们包装在div中,因此markdown将如下所示:

# A Header

<div class="row">
<div class="span6">
``` javascript
$(document).ready(function() {})
```
</div>
</div>

这样我就可以利用markdown和twitter bootstrap.

但是当我这样做时,代码块永远不会被处理.如果没有深入编写HTML解析代码,有没有办法实现？

谢谢!

Answer 1

根据Markdown规范(例如它):

在块级HTML标记中不处理Markdown格式化语法.例如,您不能*emphasis*在HTML块中使用Markdown样式.

Redcarpet GitHub页面上有一个功能请求,但遗憾的是没有任何结论可以帮助您.

可能这里阻力最小的路径是通过Redcarpet运行它,然后通过Nokogiri运行生成的HTML,再次通过Redcarpet运行每个块级节点的内容.例如:

require 'redcarpet'
require 'nokogiri'

block_nodes = %w(p div blockquote ...) #¹

markdown = Redcarpet::Markdown.new Redcarpet::Render::HTML,
             :fenced_code_blocks => true

html = markdown.render text

noko_doc = Nokogiri::HTML::DocumentFragment.parse html

noko_doc.css( *block_nodes ).each do |node|
  node.content = markdown.render node.content if node.text?
end

html = noko_doc.to_html

¹https ://github.com/tanoku/sundown/blob/master/html_block_names.txt

当然,如果你有多个嵌套级别(包含一个包含HTML块的Markdown块的HTML块等),你必须在你生成的任何新HTML节点上递归地执行此操作.这很容易,但显然具有性能影响,这就是为什么我说"阻力最小的路径"而不是"所有情况下的最佳解决方案".