有没有办法通过标记div在web开发中使用Markdown?

Is there a way of using Markdown in web development by tagging div?

是否可以在不手动解析内容的情况下在网站上使用 Markdown?

我看到 this tool 可以用来创建带有 markdown 的网站,但我需要通过 运行 一些命令手动解析内容,例如 marked.parse().

我不想手动解析所有内容,我希望使用“class”直接从网站解析内容。 例如,如果我添加 class="markdown" 那么内容将被解析,如下所示:

<!doctype html>
<html>
<head>
  <script src="https://<some website>"></script>
  <title>Marked in the browser</title>
</head>
<body>
  <div class="markdown">
    # Hellow World !
  </div>
</body>
</html>

我该怎么做?

从上面的评论...

"Is there any tool that does that ?" Short answer. No. There is no approach or tool which can fulfill the OP's wish by pure presentational layer magic. The OP on client side always needs a JavaScript based parsing and DOM rendering approach similar to the tool, the OP is mentioning."_

因此,OP 可以像 OP 的示例代码一样对任何降价内容进行分类。

为了将解析后的内容呈现给启用 JavaScript 的客户端的消费者,OP 需要一个额外的脚本,该脚本利用例如也已经提到 marked.parse 方法。

类似的东西...

document
  .querySelectorAll('.markdown')
  .forEach(elmNode =>
    elmNode.innerHTML = marked.parse(elmNode.textContent)
  );
body { zoom: .8; }
<script src="https://cdn.jsdelivr.net/gh/markedjs/marked@bf1295a499c60abc096124ab33804071cb8d89fe/marked.min.js"></script>

<div class="markdown">
  # Hellow World !
</div>
<div class="markdown">
  ## markdown render test
</div>
<div class="markdown">

  ## Usage

  ### Warning:  Marked does not [sanitize](https://marked.js.org/#/USING_ADVANCED.md#options) the output HTML. Please use a sanitize library, like [DOMPurify](https://github.com/cure53/DOMPurify) (recommended), [sanitize-html](https://github.com/apostrophecms/sanitize-html) or [insane](https://github.com/bevacqua/insane) on the output HTML! 

  ## Demo

  Checkout the [demo page](https://marked.js.org/demo/) to see marked in action ⛹️

  ## Docs

  Our [documentation pages](https://marked.js.org) are also rendered using marked 

  Also read about:

  * [Options](https://marked.js.org/#/USING_ADVANCED.md)
  * [Extensibility](https://marked.js.org/#/USING_PRO.md)

</div>