链接宏
MDN 提供了大量的宏,用于创建始终最新的 MDN 内容链接。在本指南中,您将了解 MDN 交叉引用宏,您可以使用它们来包含指向另一个页面的单个链接或指向文档所有子页面的链接列表。
链接列表
MDN 提供创建链接列表的宏
{{LandingPageListSubPages}}
-
在没有参数的情况下包含时,会插入当前页面子页面的链接的有序列表。此宏最常用于 侧边栏(因此宏名称),其中不会呈现项目符号。第一个参数是链接树父页面的 slug。链接文本以代码形式显示。将第二个参数设置为
true
或1
会将链接转换为纯文本。将第三个参数设置为true
或1
会在列表顶部添加指向 slug(父)页面的链接,链接文本为“概述”。 {{QuickLinksWithSubpages()}}
-
使用当前页面(或指定页面)的子项作为目标,创建一组快速链接。这将创建最多两级深度的分层列表。页面的标题用作链接文本,摘要用作工具提示。
示例链接列表
交叉引用链接
一些宏创建单个链接以交叉引用 CSS、JavaScript、SVG 或 HTML 功能,包括属性、元素、属性、数据类型和 API。创建单个链接的宏至少需要一个参数:要引用的功能。
这些宏是
{{CSSxRef("")}}
{{DOMxRef("")}}
{{HTMLElement("")}}
{{glossary("")}}
{{JSxRef("")}}
{{SVGAttr("")}}
{{SVGElement("")}}
{{HTTPMethod("")}}
{{HTTPStatus("")}}
这些宏的第一个参数是所引用文档的 slug 的最后一部分。例如,对于 HTML 元素,请在 slug 后面包含 {{HTMLElement("")}}
,其中 slug 后面的部分是第一个参数。对于 {{CSSxRef("")}}
,请添加 slug 后面 Web/CSS/
之后的 slug 部分。链接将指向此页面。
默认情况下,显示的文本是在第一个参数中编写的链接资源,对于 {{HTMLElement()}}
的情况,则在尖括号中。这可能不是您想要的。例如,范围输入类型的 slug 是 Web/HTML/Element/input/range
。包含 {{HTMLElement("input/range")}}
会产生 "<input/range>
"。这不是您想要的。所有宏都接受其他参数,因此您可以提供要显示的文本。
如果存在,第二个参数将提供链接文本。在输入范围情况下,我们将编写 {{HTMLElement("input/range", "
,它会产生 "<input type="range">
")}}<input type="range">
"。此特定宏会删除 <code>
和尖括号,如果第二个参数包含空格,因此我们添加了括号和代码标记。
每个宏都不一样!
为了防止 HTML 代码语义和 CSS 代码样式,一些交叉引用宏包含一个带有 "nocode"
的参数来禁用此样式。
例如,{{CSSxRef("background-color")}}
会创建代码链接 "background-color
",而 {{domxref("CSS.supports_static", "check support", "", "nocode")}}
会创建纯文本链接 "check support"。
确保查看源代码以了解您正在使用的宏的工作原理以及每个宏的不同参数;虽然参数通常有很好的文档,但我们之前在 {{HTMLElement("")}}
宏中看到的“如果第二个参数包含空格,则不要作为代码呈现”之类的例外情况在代码中,但没有其他文档。
要了解每个宏支持哪些参数以及每个宏的参数顺序,宏的源文件(上面链接)包含文档。有一个 常用宏列表,每个宏都会在页面的主要内容区域输出链接。