兼容性表格和浏览器兼容性数据仓库（BCD）

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2019.

MDN 为我们的开放 web 文档提供了兼容性表格的标准格式；它是对比所有浏览器之间，包含 DOM、HTML、CSS、JavaScript、SVG 等技术的文档。为使这些数据可以编程的方式在在多个项目中可用，我们从 browser-compat-data 仓库构建了一个 Node.js 包，并将其发布到了 npm。

要修改这些表格中的数据，以及获取最新的用于表示数据的流程和 JSON 格式的更改，请参考数据仓库的 contributor guide 和 data guidelines guide。如果你有疑问或是发现了问题，欢迎与我们联系。

在 MDN 页面中使用浏览器兼容性数据

一旦你创建的兼容性数据被包含在 browser-compat-data 仓库中，你就可以开始根据 MDN 页面上的数据动态生成浏览器兼容性表格和规范表格。

首先，你需要确定你希望包含的相关兼容性数据的查询字符串。可以通过检查其源文件来确定。例如：

AbortController 的兼容性数据在 api/AbortController.json 中定义，可以使用 api.AbortController 来引用它。
Content-Type HTTP 标头的兼容性数据在 http/headers/content-type.json 中定义，可以使用 http.headers.Content-Type 来引用它。
VRDisplay.capabilities (en-US) 属性的兼容性数据在 api/VRDisplay.json 中定义，可以使用 api.VRDisplay.capabilities 来引用它。

兼容性数据的查询字符串应在页面的元数据（front-matter）中使用 browser-compat 这个键来指定。例如，对于 AbortController，应该这样添加：

---
title: AbortController
slug: Web/API/AbortController
page-type: web-api-interface
browser-compat: api.AbortController
---

然后源码中的 {{Compat}} 和 {{Specifications}} 宏将会被自动渲染为与元数据对应的兼容性表格和规范表格。

如果需要在同一页面中插入多个兼容性表格，可以将 browser-compat 元数据指定为一个数组。例如，对于 Channel Messaging API，应该这样添加：

---
title: Channel Messaging API
slug: Web/API/Channel_Messaging_API
page-type: web-api-overview
browser-compat:
  - api.MessageChannel
  - api.MessagePort
---

宏的调用会生成以下的表格（以及对应的备注）：

兼容性表格示例

BCD tables only load in the browser

规范表格示例

Specification
DOM Standard # interface-abortcontroller