Html Markdown 中的交叉引用（命名锚点）

Cross-reference (named anchor) in markdown

提问by Synesso

Is there markdownsyntax for the equivalent of:

是否有相当于以下内容的降价语法：

Take me to <a href="#pookie">pookie</a>

... 

<a name="pookie">this is pookie</a>

回答by Steve Powell

Take me to [pookie](#pookie)

should be the correct markdown syntax to jump to the anchor point named pookie.

应该是跳转到名为 pookie 的锚点的正确降价语法。

To insert an anchor point of that name use HTML:

要插入该名称的锚点，请使用 HTML：

<a name="pookie"></a>

Markdown doesn't seem to mind where you put the anchor point. A useful place to put it is in a header. For example:

Markdown 似乎并不介意你把锚点放在哪里。一个有用的地方是放在标题中。例如：

### <a name="tith"></a>This is the Heading

works very well. (I'd demonstrate here but SO's renderer strips out the anchor.)

效果很好。（我会在这里演示，但 SO 的渲染器去掉了锚点。）

Note on self-closing tags and id=versus name=

注意自我结束标记和id=对name=

An earlier version of this post suggested using <a id='tith' />, using the self-closing syntax for XHTML, and using the idattribute instead of name.

这篇文章的早期版本建议使用<a id='tith' />，使用 XHTML 的自闭合语法，并使用id属性而不是name.

XHTML allows for any tag to be 'empty' and 'self-closed'. That is, <tag />is short-hand for <tag></tag>, a matched pair of tags with an empty body. Most browsers will accept XHTML, but some do not. To avoid cross-browser problems, close the tag explicitly using <tag></tag>, as recommended above.

XHTML 允许任何标记为“空”和“自关闭”。也就是说，<tag />是 的简写<tag></tag>，一对匹配的带有空体的标签。大多数浏览器将接受 XHTML，但有些不接受。为避免跨浏览器问题<tag></tag>，请按照上面的建议使用 明确关闭标签。

Finally, the attribute name=was deprecated in XHTML, so I originally used id=, which everyone recognises. However, HTML5 now creates a global variable in JavaScript when using id=, and this may not necessarily be what you want. So, using name=is now likely to be more friendly.

最后这个属性name=在XHTML中被弃用了，所以我原来用的是id=，大家都认可的。但是，HTML5 现在在使用 时会在 JavaScript 中创建一个全局变量id=，这可能不一定是您想要的。因此，name=现在使用可能会更加友好。

(Thanks to Slipp Douglasfor explaining XHTML to me, and nailerfor pointing out the HTML5 side-effect — see the comments and nailer's answerfor more detail. name=appears to work everywhere, though it is deprecated in XHTML.)

（感谢SLIPP道格拉斯解释XHTML我，钉枪的指出了HTML5的副作用-看到的评论和钉枪的回答更多的细节。name=似乎工作无处不在，但它是在XHTML弃用。）

回答by La Muerte Peluda

On bitbucket.org the voted solution wouldn't work. Instead, when using headers (with ##), it is possible to reference them as anchors by prefixing them as #markdown-header-my-header-name, where #markdown-header- is an implicit prefix generated by the renderer, and the rest is the lower-cased header title with dashes replacing spaces.

在 bitbucket.org 上，投票的解决方案不起作用。相反，当使用标头（带有##）时，可以通过将它们作为前缀来引用它们作为锚点 #markdown-header-my-header-name，其中 #markdown-header- 是由渲染器生成的隐式前缀，并且其余的是小写的标题标题，用破折号代替空格。

Example

例子

## My paragraph title

will produce an implicit anchor like this

会产生一个像这样的隐式锚点

#markdown-header-my-paragraph-title

The whole URL before each anchor reference is optional, i.e.

每个锚引用之前的整个 URL 是可选的，即

[Some text](#markdown-header-my-paragraph-title)

is equivalent of

相当于

[Some text](https://bitbucket.org/some_project/some_page#markdown-header-my-paragraph-title) 

provided that they are in the same page.

前提是它们在同一页面。

Source: https://bitbucket.org/tutorials/markdowndemo/overview(edit source of this .md file and look at how anchors are made).

来源：https: //bitbucket.org/tutorials/markdowndemo/overview（编辑此 .md 文件的源代码并查看锚点是如何制作的）。

回答by mikemaccana

Use a name. Using an idisn't necessary in HTML 5 and will create global variables in your JavaScript

使用一个name. id在 HTML 5 中不需要使用 an ，它会在你的 JavaScript 中创建全局变量

See the HTML 5 specification, 5.9.8 Navigating to a fragment identifier- both idand nameare used.

请参阅 HTML 5 规范，5.9.8 导航到片段标识符-id和name都使用。

It's important to know that most browsers still turn IDs into global variables. Here's a quick test. Using a nameavoids creating globals and any conflicts that may result.

重要的是要知道大多数浏览器仍然将 ID 转换为全局变量。这是一个快速测试。使用 aname可避免创建全局变量和可能导致的任何冲突。

Example using a name:

使用名称的示例：

Take me to [pookie](#pookie)

And the destination anchor:

和目的地锚点：

### <a name="pookie"></a>Some heading

回答by You

There's no readily available syntax to do this in the original Markdown syntax, but Markdown Extraprovides a means to at least assign IDs to headers — which you can then link to easily. Note also that you can use regular HTML in both Markdown and Markdown Extra, and that the nameattribute has been superseded by the idattribute in more recent versions of HTML.

在原始 Markdown 语法中没有现成的语法可以做到这一点，但Markdown Extra提供了一种至少为标题分配 ID 的方法 - 然后您可以轻松链接到标题。另请注意，您可以在 Markdown 和 Markdown Extra 中使用常规 HTML，并且该name属性已被id更新版本的 HTML 中的属性取代。

回答by jeffmcneill

Markdown Anchorsupports the hashmark, so a link to an anchor in the page would simply be [Pookie](#pookie)

Markdown Anchor支持哈希标记，因此指向页面中的锚点的链接只是[Pookie](#pookie)

Generating the anchor is not actually supported in Gruber Markdown, but is in other implementations, such as Markdown Extra.

Gruber Markdown 实际上并不支持生成锚点，但在其他实现中是支持的，例如Markdown Extra。

In Markdown Extra, the anchor ID is appended to a header or subhead with {#pookie}.

在 Markdown Extra 中，锚 ID 被附加到带有{#pookie}.

Github Flavored Markdownin Git repository pages (but not in Gists) automatically generates anchorswith several markup tags on all headers (h1, h2, h3, etc.), including:

Git 存储库页面中的GithubFlavored Markdown（但不在 Gists 中）自动在所有标题（h1、h2、h3 等）上生成带有多个标记标签的锚点，包括：

• id="user-content-HEADERTEXT"
• class="anchor"
• href="#HEADERTEXT"
• aria-hidden="true"(this is for an svg link icon that displays on mouseover)

• id="user-content-HEADERTEXT"
• class="anchor"
• href="#HEADERTEXT"
• aria-hidden="true"（这是用于在鼠标悬停时显示的 svg 链接图标）

Excluding the aria/svg icon, when one writes:

不包括 aria/svg 图标，当一个人写道：

• # Header Title

• # Header Title

Github generates:

Github 生成：

• <h1><a id="user-content-header-title" class="anchor" href="#header-title">Header Title</a></h1>

• <h1><a id="user-content-header-title" class="anchor" href="#header-title">Header Title</a></h1>

Therefore, one need do nothing to create the header links, and can always link to them with:

因此，无需做任何事情来创建标题链接，并且始终可以通过以下方式链接到它们：

• Link to the [Header Title](#header-title)

• 链接到 [Header Title](#header-title)

回答by keyoxy

For anyone who is looking for a solution to this problem in GitBook. This is how I made it work (in GitBook). You need to tag your header explicitly, like this:

对于在 GitBook 中寻找此问题解决方案的任何人。这就是我让它工作的方式（在 GitBook 中）。您需要明确标记您的标题，如下所示：

# My Anchored Heading {#my-anchor}

Then link to this anchor like this

然后像这样链接到这个锚点

[link to my anchored heading](#my-anchor)

Solution, and additional examples, may be found here: https://seadude.gitbooks.io/learn-gitbook/

可以在此处找到解决方案和其他示例：https: //seadude.gitbooks.io/learn-gitbook/

回答by symbolrush

Late to the party, but I think this addition might be useful for people working with rmarkdown. In rmarkdownthere is built-in support for references to headers in your document.

聚会迟到了，但我认为这个添加可能对使用rmarkdown. 在rmarkdown有内置在你的文档中引用头支持。

Any header defined by

由定义的任何标头

#?Header

can be referenced by

可以参考

get me back to that [header](#header)

The following is a minimal standalone .rmdfile that shows this behavior. It can be knitted to .pdfand .html.

以下是.rmd显示此行为的最小独立文件。它可以织成.pdf和.html。

---
title: "references in rmarkdown"
output:
  html_document: default
  pdf_document: default
---

# Header

Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. 

Go back to that [header](#header).

回答by Ryan McGuinness

Using the latest Markdown, you should be able to use the following syntax:

使用最新的 Markdown，您应该能够使用以下语法：

[](){:name='anchorName'}

[](){:name='anchorName'}

This should create the following HTML:

这应该创建以下 HTML：

<a name="anchorName"></a>

<a name="anchorName"></a>

If you wanted the anchor to have text, simply add the anchor text within the square brackets:

如果您希望锚具有文本，只需在方括号内添加锚文本：

[Some Text](){:name='anchorName'}

[Some Text](){:name='anchorName'}

回答by Ulysse BN

For most common markdown generators. You have a simple self generated anchor in each header. For instance with pandoc, the generated anchor will be a kebab case slug of your header.

对于最常见的降价生成器。每个标题中都有一个简单的自生成锚点。例如，使用pandoc，生成的锚点将是标题的烤肉串。

 echo "# Hello, world\!" | pandoc
 # => <h1 id="hello-world">Hello, world!</h1>

Depending on which markdown parser you use, the anchor can change (take the exemple of symbolrush and La muerte Peluda answers, they are different!). See this babelmarkwhere you can see generated anchors depending on your markdown implementation.

根据您使用的降价解析器，锚点可以改变（以symbolrush 和La muerte Peluda 的答案为例，它们是不同的！）。请参阅此babelmark，您可以在其中查看根据您的降价实现生成的锚点。