Question

我的目标是，

1）从我的GitHub仓库中的README.md文件中读取Markdown源 2）将Markdown转换为HTML代码 3）将输出HTML应用于<div>。

仅使用客户端技术。

我知道如何使用jQuery将Markdown代码转换为HTML，但不知道如何从GitHub repo中的README.md文件中动态读取MD源。

Answer 1

从GitHub仓库获取README.md文件的原始文件URL。
按以下格式格式化网址， http://markdown.io/<url_readme_file>。假设我的readme.md文件的网址是http://raw.github.com/pankajparashar/nerdy-css/master/README.md。因此，新网址变为http://markdown.io/http://raw.github.com/pankajparashar/nerdy-css/master/README.md
现在使用这个新网址使用jQuery的加载方法，并从页面的#md-content id中提取内容。

此处提供上述步骤的完整演示 - http://jsfiddle.net/pankajparashar/EQBFZ/

Answer 2

你应该看看：

https://github.com/zmckinnon/jquery-gh-readme

它使用GitHub API使用此调用检索自述文件的内容：

GET / repos /：owner /：repo / readme

然后它转换base64加密内容。

然后它使用标记将。降价内容转换为html。

Answer 3

转到GitHub项目页面
点击README.md文件
现在点击原始按钮

原始文件是您要加载的实际网址。

创建一个名为load.php的PHP（或您使用的任何服务器端语言）文件，专门用于加载远程文件（如RAW文件）。 PHP脚本将接受$_GET['url']变量。将变量传递给file_get_contents()，然后输出结果。 请注意，下面的代码是一个非常简单的示例。

echo file_get_contents($_GET['url']);

现在，只需使用jQuery中的load函数从PHP文件中引入数据内容即可。您的网址格式可能与此类似...

.load("load.php?url=https://raw.github.com/user/project/master/README.md")

最后，使用您已描述的任何方式转换为Markdown。

PHP file_get_contents()：http://php.net/manual/en/function.file-get-contents.php
jQuery load()：http://api.jquery.com/load/
有关绕过同源策略的更多信息：http://www.mikazo.com/2010/09/how-to-getting-around-ajax-same-origin.html

Answer 4

值得注意的是，HTML确实可以在ReadMe.md文件中使用。有了这个清晰的理解，我想很多这样的问题会自动回答如下 - 如何在自述文件中制作粗体字体，或者如何插入图像等。另请注意，这很大程度上取决于您使用的应用程序/文本编辑器和在操作系统上也很多。最近我在Github的Readme.md文件中插入空行字符时遇到了麻烦。

我个人更喜欢＆lt; br /＆gt;标记在那里，我有一个完整的帖子描述相同：http://www.w3lc.com/2017/05/new-line-in-readme-file-github-fixing.html

我已经在帖子中解释了Github存储库中的git提交的变化。这个理解非常需要处理这个问题，并找到许多其他用途，为什么你可能需要这样做呢！

此外，要直接回答您的问题，您需要两个步骤： 1.在Raw版本中找到ReadMe.md文件的URL。例如，见一个：https://raw.githubusercontent.com/Anwar-Faiz/forkrap/master/README.md 2.现在，如果你想使用服务器端使用php的file_gets_content等你可以加载网址。或者，如果要使用jquery，可以使用Load（）。

请注意，如果您查看原始URL页面的源，您只看到纯文本。所以，你也不需要做很多文本解析的东西:)这是一个好消息。

接下来，你可以使用unescape函数或codebeautify这样的工具来解决可能随HTML的外观和感觉而改变的字符，如'＆lt; “等等。

从GitHub README.md文件Markdown到HTML

4 个答案: