是否有(最好是轻量级的方式)在 HTML 中包含 Markdown 文件的原始内容?
我正在使用 remark.js 创建幻灯片,我想将 markdown 文件与 HTML 分开,以便 HTML 非常简单(并且不会更改):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Test</title>
<link rel="stylesheet" href="style.css">
<script src="https://gnab.github.io/remark/downloads/remark-latest.min.js"></script>
</head>
<body>
<textarea id="source">
>>'paste' markdown file test.md<<
</textarea>
<script>
var slideshow = remark.create({
highlightStyle: 'darkula',
highlightLines: true
});
</script>
</body>
</html>
理想情况下,它可以离线运行并在本地计算机上运行(无需运行网络服务器)。 “粘贴” Markdown 文件 test.md' 的位显然不起作用(因此我的问题)。我试过:
object data="test.md"
但是会生成丑陋的 iframe- This solution但我只有一个空白页面(我使用了 jQuery 的 CDN)。
最佳答案
根据 remarkjs wiki您需要添加以下行以包含您的 Markdown 文件
var slideshow = remark.create({
sourceUrl: 'markdown.md'
});
下面是一个完整的例子
<!DOCTYPE html>
<html>
<head>
<title>A title</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style type="text/css">
@import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz);
@import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic);
@import url(https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic);
body { font-family: 'Droid Serif'; }
h1, h2, h3 {
font-family: 'Yanone Kaffeesatz';
font-weight: normal;
}
.remark-code, .remark-inline-code { font-family: 'Ubuntu Mono'; }
</style>
</head>
<body>
<script src="https://remarkjs.com/downloads/remark-latest.min.js" type="text/javascript">
</script>
<script type="text/javascript">
var slideshow = remark.create({
sourceUrl: 'your_file.md'
});
</script>
</body>
</html>
关于html - 在 HTML 中为 remark.js 包含 Markdown 文件内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41607371/