From 39a1689ff5769191a2cdf68d198c89422db7f44c Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Fri, 27 Sep 2024 22:06:58 +0800
Subject: [PATCH 01/43] [zh-CN]: sync translation for Fullscreen API events
 (#23761)

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: A1lo <yin199909@aliyun.com>
---
 .../document/fullscreenchange_event/index.md  | 79 ++++++++++-----
 .../document/fullscreenerror_event/index.md   |  6 +-
 .../element/fullscreenchange_event/index.md   | 98 ++++++++++++-------
 .../element/fullscreenerror_event/index.md    | 51 ++++++----
 4 files changed, 150 insertions(+), 84 deletions(-)

diff --git a/files/zh-cn/web/api/document/fullscreenchange_event/index.md b/files/zh-cn/web/api/document/fullscreenchange_event/index.md
index e4390cf0c23fa2..4c70b83c73a1d2 100644
--- a/files/zh-cn/web/api/document/fullscreenchange_event/index.md
+++ b/files/zh-cn/web/api/document/fullscreenchange_event/index.md
@@ -1,11 +1,13 @@
 ---
 title: Document：fullscreenchange 事件
 slug: Web/API/Document/fullscreenchange_event
+l10n:
+  sourceCommit: 8a12b2889c9dbcb7d9ed026cac3a8538ec5cb277
 ---
 
-{{APIRef}}
+{{APIRef("Fullscreen API")}}
 
-`fullscreenchange` 事件会在浏览器进入或退出全屏模式后立即触发。
+**`fullscreenchange`** 事件会在浏览器进入或退出全屏模式后立即触发。
 
 该事件被发送到正在进入或退出全屏模式的 `Element`，并且此事件会向上冒泡到 `Document` 对象。
 
@@ -15,7 +17,7 @@ slug: Web/API/Document/fullscreenchange_event
 
 ## 语法
 
-在诸如 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 之类的方法中使用事件名称，或设置事件处理程序属性。
+在类似于 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 之类的方法中使用事件名称，或设置事件处理器属性。
 
 ```js
 addEventListener("fullscreenchange", (event) => {});
@@ -29,13 +31,15 @@ onfullscreenchange = (event) => {};
 
 ## 示例
 
-在此示例中，向 {{domxref("Document")}} 添加了 `fullscreenchange` 事件处理程序。
+### 打印 `fullscreenchange` 事件
 
-如果用户单击“切换全屏模式”按钮，`click` 处理程序将切换 `div` 的全屏模式。如果 `document.fullscreenElement` 具有值，则会退出全屏模式。否则，div 将被置于全屏模式。
+在此示例中，向 {{domxref("Document")}} 添加了 `fullscreenchange` 事件处理器。
+
+如果用户单击“切换全屏模式”按钮，`click` 处理器将切换 `div` 的全屏模式。如果 `document.fullscreenElement` 具有值，则会退出全屏模式。否则，div 将被置于全屏模式。
 
 请记住，在处理 `fullscreenchange` 事件时，元素的状态已经发生了变化。因此，如果更改是为了全屏模式，`document.fullscreenElement` 将指向现在处于全屏模式的元素。另一方面，如果 `document.fullscreenElement` 为 `null`，则全屏模式已被取消。
 
-对于示例代码，这意味着，如果元素当前处于全屏模式，则 `fullscreenchange` 处理程序将将全屏元素的 `id` 记录在控制台中。如果 `document.fullscreenElement` 为 `null`，则代码记录消息表示更改是为了退出全屏模式。
+对于示例代码，这意味着，如果元素当前处于全屏模式，则 `fullscreenchange` 处理器在控制台中打印全屏元素的 `id`。如果 `document.fullscreenElement` 为 `null`，则代码记录消息表示更改是为了退出全屏模式。
 
 ### HTML
 
@@ -43,38 +47,61 @@ onfullscreenchange = (event) => {};
 <h1>fullscreenchange 事件示例</h1>
 <div id="fullscreen-div">
   <button id="toggle-fullscreen">切换全屏模式</button>
+  <pre id="logger"></pre>
 </div>
 ```
 
+#### CSS
+
+```css
+* {
+  box-sizing: border-box;
+}
+
+#fullscreen-div {
+  height: 150px;
+  padding: 1rem;
+  background-color: pink;
+}
+
+#logger {
+  height: 80px;
+  padding: 0 0.5rem;
+  background-color: white;
+  overflow: scroll;
+}
+```
+
 ### JavaScript
 
 ```js
+const logger = document.querySelector("#logger");
+const fullScreenElement = document.querySelector("#fullscreen-div");
+
+function log(message) {
+  logger.textContent = `${logger.textContent}\n${message}`;
+}
+
 function fullscreenchanged(event) {
   // 如果有元素处于全屏模式，则 document.fullscreenElement 将指向该元素。如果没有元素处于全屏模式，则该属性的值为 null。
   if (document.fullscreenElement) {
-    console.log(
-      `Element: ${document.fullscreenElement.id} entered fullscreen mode.`,
-    );
+    log(`元素：${document.fullscreenElement.id} 进入全屏模式。`);
   } else {
-    console.log("Leaving fullscreen mode.");
+    log("退出全屏模式。");
   }
 }
 
 document.addEventListener("fullscreenchange", fullscreenchanged);
-// 或
-document.onfullscreenchange = fullscreenchanged;
-
-// 在 toggle 按钮被点击时，将会进入或退出全屏模式
-document
-  .getElementById("toggle-fullscreen")
-  .addEventListener("click", (event) => {
-    if (document.fullscreenElement) {
-      // exitFullscreen 方法只能在 Document 对象上使用。
-      document.exitFullscreen();
-    } else {
-      el.requestFullscreen();
-    }
-  });
+
+// 在切换按钮被点击时，将会进入或退出全屏模式
+document.getElementById("toggle-fullscreen").addEventListener("click", () => {
+  if (document.fullscreenElement) {
+    // exitFullscreen 方法只能在 Document 对象上使用。
+    document.exitFullscreen();
+  } else {
+    fullScreenElement.requestFullscreen();
+  }
+});
 ```
 
 ## 规范
@@ -89,5 +116,5 @@ document
 
 - {{domxref("Document/fullscreenerror_event", "fullscreenerror")}}
 - {{domxref("Element")}}：{{domxref("Element/fullscreenchange_event", "fullscreenchange")}} 事件
-- [Fullscreen API](/zh-CN/docs/Web/API/Fullscreen_API)
-- [Fullscreen API 指南](/zh-CN/docs/Web/API/Fullscreen_API/Guide)
+- [全屏 API](/zh-CN/docs/Web/API/Fullscreen_API)
+- [全屏 API 指南](/zh-CN/docs/Web/API/Fullscreen_API/Guide)
diff --git a/files/zh-cn/web/api/document/fullscreenerror_event/index.md b/files/zh-cn/web/api/document/fullscreenerror_event/index.md
index 0140e24fc1afd5..4a13c987f6a7f4 100644
--- a/files/zh-cn/web/api/document/fullscreenerror_event/index.md
+++ b/files/zh-cn/web/api/document/fullscreenerror_event/index.md
@@ -2,12 +2,12 @@
 title: Document：fullscreenerror 事件
 slug: Web/API/Document/fullscreenerror_event
 l10n:
-  sourceCommit: 41a8b9c9832359d445d136b6d7a8a28737badc6b
+  sourceCommit: 8a12b2889c9dbcb7d9ed026cac3a8538ec5cb277
 ---
 
-{{ApiRef}}
+{{APIRef("Fullscreen API")}}
 
-当浏览器不能切换至全屏模式时，会触发 `fullscreenerror` 事件。
+**`fullscreenerror`** 事件在浏览器不能切换全屏模式时触发。
 
 与 [`fullscreenchange` 事件](/zh-CN/docs/Web/API/Document/fullscreenchange_event)一样，会触发两个 `fullscreenerror` 事件；第一个事件会发送给未能更改模式的 {{domxref("Element")}}，第二个事件会发送给拥有该元素的 {{domxref("Document")}}。
 
diff --git a/files/zh-cn/web/api/element/fullscreenchange_event/index.md b/files/zh-cn/web/api/element/fullscreenchange_event/index.md
index a236b7132031e4..af68c212a198b7 100644
--- a/files/zh-cn/web/api/element/fullscreenchange_event/index.md
+++ b/files/zh-cn/web/api/element/fullscreenchange_event/index.md
@@ -1,53 +1,82 @@
 ---
-title: Element.onfullscreenchange
+title: Element：fullscreenchange 事件
 slug: Web/API/Element/fullscreenchange_event
+l10n:
+  sourceCommit: 8a12b2889c9dbcb7d9ed026cac3a8538ec5cb277
 ---
 
-{{APIRef}}
+{{APIRef("Fullscreen API")}}
 
-元素接口的 **`onfullscreenchange`** 属性是在元素过渡到或过渡到全屏模式时触发的全屏更改事件的事件处理程序。
+**`fullscreenchange`** 事件会在浏览器进入或退出全屏模式后立即触发。
+
+该事件被发送到正在进入或退出全屏模式的 `Element`。
+
+要确定 `Element` 是进入还是退出全屏模式，请检查 {{domxref("Document.fullscreenElement")}} 的值：如果此值为 `null`，则表示该元素正在退出全屏模式，否则表示该元素正在进入全屏模式。
+
+此事件不能被取消。
 
 ## 语法
 
-```plain
-targetDocument.onfullscreenchange = fullscreenChangeHandler;
+在类似于 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 之类的方法中使用事件名称，或设置事件处理器属性。
+
+```js
+addEventListener("fullscreenchange", (event) => {});
+
+onfullscreenchange = (event) => {};
 ```
 
-### 值
+## 事件类型
+
+通用的 {{domxref("Event")}}。
 
-当事件处理程序处于 `fullscreenchange` 模式的时候，表明游戏元素被改变了或者是退出了全屏模式
+## 示例
 
-## Example
+在此示例中，向 ID 为 `fullscreen-div` 的元素添加了 `fullscreenchange` 事件处理器。
 
-本示例建立一个`fullscreenchange` 处理程序，`handleFullscreenChange ()`。此函数通过检查 [`event.target`](/zh-CN/docs/Web/API/Event/target) 的值来确定调用它的元素，然后将文档的[`fullscreenElement`](/zh-CN/docs/Web/API/Document/fullscreenElement) 值与元素进行比较，以查看它们是否为同一节点。
+如果用户单击“切换全屏模式”按钮，`click` 处理器将切换 `div` 的全屏模式。如果 `document.fullscreenElement` 具有值，则会退出全屏模式。否则，div 将被置于全屏模式。
 
-这给了我们一个值，即 `isFullscreen`, 我们将其传递到一个名为 `adjustMyControls()` 的函数，我们想象它是一个函数，可以对应用的用户界面进行调整，以便在全屏模式下而不是在窗口。
+请记住，在处理 `fullscreenchange` 事件时，元素的状态已经发生了变化。因此，如果更改是进入全屏模式，`document.fullscreenElement` 将指向现在处于全屏模式的元素。另一方面，如果 `document.fullscreenElement` 为 `null`，则全屏模式已被取消。
+
+对于示例代码，这意味着，如果元素当前处于全屏模式，则 `fullscreenchange` 处理器在控制台中打印全屏元素的 `id`。如果 `document.fullscreenElement` 为 `null`，则代码记录消息表示更改是退出全屏模式。
+
+### HTML
+
+```html
+<h1>fullscreenchange 事件示例</h1>
+<div id="fullscreen-div">
+  <button id="toggle-fullscreen">切换全屏模式</button>
+</div>
+```
+
+### JavaScript
 
 ```js
-function toggleFullscreen() {
-  let elem = document.querySelector("video");
-
-  elem.onfullscreenchange = handleFullscreenChange;
-  if (!document.fullscreenElement) {
-    elem
-      .requestFullscreen()
-      .then({})
-      .catch((err) => {
-        alert(
-          `Error attempting to enable full-screen mode: ${err.message} (${err.name})`,
-        );
-      });
+function fullscreenchanged(event) {
+  // 如果有元素处于全屏模式，则 document.fullscreenElement 将指向该元素。如果没有元素处于全屏模式，则该属性的值为 null。
+  if (document.fullscreenElement) {
+    console.log(`元素：${document.fullscreenElement.id} 进入全屏模式。`);
   } else {
-    document.exitFullscreen();
+    console.log("退出全屏模式。");
   }
 }
 
-function handleFullscreenChange(event) {
-  let elem = event.target;
-  let isFullscreen = document.fullscreenElement === elem;
-
-  adjustMyControls(isFullscreen);
-}
+const el = document.getElementById("fullscreen-div");
+
+el.addEventListener("fullscreenchange", fullscreenchanged);
+// 或
+el.onfullscreenchange = fullscreenchanged;
+
+// 在切换按钮被点击时，将会进入或退出全屏模式
+document
+  .getElementById("toggle-fullscreen")
+  .addEventListener("click", (event) => {
+    if (document.fullscreenElement) {
+      // exitFullscreen 方法只能在 Document 对象上使用。
+      document.exitFullscreen();
+    } else {
+      el.requestFullscreen();
+    }
+  });
 ```
 
 ## 规范
@@ -60,8 +89,7 @@ function handleFullscreenChange(event) {
 
 ## 参见
 
-- [Fullscreen API](/zh-CN/docs/Web/API/Fullscreen_API)
-- [Guide to the Fullscreen API](/zh-CN/docs/Web/API/Fullscreen_API/Guide)
-- [`fullscreenchange`](/zh-CN/docs/Web/Events/fullscreenchange)
-- [`Element.onfullscreenerror`](/zh-CN/docs/Web/API/Element/onfullscreenerror)
-- The [`Document`](/zh-CN/docs/Web/API/Document) equivalent: [`onfullscreenchange`](/zh-CN/docs/Web/API/Document/onfullscreenchange).
+- [Document：fullscreenchange 事件](/zh-CN/docs/Web/API/Document/fullscreenchange_event)
+- [Element：fullscreenerror 事件](/zh-CN/docs/Web/API/Element/fullscreenerror_event)
+- [全屏 API](/zh-CN/docs/Web/API/Fullscreen_API)
+- [全屏 API 指南](/zh-CN/docs/Web/API/Fullscreen_API/Guide)
diff --git a/files/zh-cn/web/api/element/fullscreenerror_event/index.md b/files/zh-cn/web/api/element/fullscreenerror_event/index.md
index c957c616cbfb37..3450f6ec029cdc 100644
--- a/files/zh-cn/web/api/element/fullscreenerror_event/index.md
+++ b/files/zh-cn/web/api/element/fullscreenerror_event/index.md
@@ -1,36 +1,49 @@
 ---
-title: Element.onfullscreenerror
+title: Element：fullscreenerror 事件
 slug: Web/API/Element/fullscreenerror_event
+l10n:
+  sourceCommit: 8a12b2889c9dbcb7d9ed026cac3a8538ec5cb277
 ---
 
-{{ApiRef("Fullscreen API")}}
+{{APIRef("Fullscreen API")}}
 
-{{domxref("Element")}} 接口的 **`onfullscreenerror`** 属性是在{{domxref("Element")}} 过渡到或退出全屏模式发生错误后处理事件[`fullscreenerror`](/zh-CN/docs/Web/API/Document/fullscreenerror_event)的事件处理程序。
+**`fullscreenerror`** 事件在浏览器不能切换全屏模式时触发。
+
+与 [`fullscreenchange` 事件](/zh-CN/docs/Web/API/Element/fullscreenchange_event)一样，会触发两个 `fullscreenerror` 事件；第一个事件会发送给未能更改模式的 {{domxref("Element")}}，第二个事件会发送给拥有该元素的 {{domxref("Document")}}。
+
+有关切换到全屏模式可能失败的原因，请参阅[全屏 API 指南](/zh-CN/docs/Web/API/Fullscreen_API/Guide)。
+
+该事件不可取消。
 
 ## 语法
 
-```plain
-targetElement.onfullscreenerror = fullscreenErrorHandler;
+在类似于 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 的方法中使用事件名称，或设置事件处理器属性。
+
+```js
+addEventListener("fullscreenchange", (event) => {});
+
+onfullscreenchange = (event) => {};
 ```
 
-### 值
+## 事件类型
 
-一个处理事件[`fullscreenerror`](/zh-CN/docs/Web/API/Document/fullscreenerror_event)的事件处理程序。
+通用的 {{domxref("Event")}}。
 
 ## 示例
 
-本示例尝试不从用户发起的事件 (如点击事件[`click`](/zh-CN/docs/Web/API/Element/click_event)或键盘事件[`keypress`](/zh-CN/docs/Web/API/Element/keypress_event)) 处理程序来触发全屏，由于全屏模式只允许由用户主动输入触发，因此该操作会发生错误，从而导致{{domxref("Element")}}会触发[`fullscreenerror`](/zh-CN/docs/Web/API/Document/fullscreenerror_event)事件传递给错误处理程序
-
 ```js
-let elem = document.querySelector("video")}}
+const requestor = document.querySelector("div");
 
-elem.onfullscreenerror = function ( event ) {
-  displayWarning("Unable to switch into full-screen mode.");
-};
+function handleError(event) {
+  console.error("切换至全屏模式时发生错误");
+  console.log(event);
+}
 
-//....
+requestor.addEventListener("fullscreenerror", handleError);
+// 或
+requestor.onfullscreenerror = handleError;
 
-elem.requestFullscreen();
+requestor.requestFullscreen();
 ```
 
 ## 规范
@@ -43,8 +56,6 @@ elem.requestFullscreen();
 
 ## 参见
 
-- [Fullscreen API](/zh-CN/docs/Web/API/Fullscreen_API)
-- [Guide to the Fullscreen API](/zh-CN/docs/Web/API/Fullscreen_API/Guide)
-- [`fullscreenerror`](/zh-CN/docs/Web/API/Document/fullscreenerror_event)
-- {{domxref("Element.onfullscreenchange")}}
-- {{domxref("Document.onfullscreenerror")}}
+- [`fullscreenchange`](/zh-CN/docs/Web/API/Element/fullscreenchange_event)
+- [全屏 API](/zh-CN/docs/Web/API/Fullscreen_API)
+- [全屏 API 使用指南](/zh-CN/docs/Web/API/Fullscreen_API/Guide)

From e8b7618bd6cd5a54f79ee2c4661a3f2e7d33667d Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Fri, 27 Sep 2024 22:07:51 +0800
Subject: [PATCH 02/43] [zh-cn]: sync translation for Picture-in-Picture API &
 add translation for `ShadowRoot.pictureInPictureElement` (#23556)

Co-authored-by: A1lo <yin199909@aliyun.com>
---
 .../document/pictureinpictureelement/index.md |  6 ++--
 .../enterpictureinpicture_event/index.md      |  2 +-
 .../leavepictureinpicture_event/index.md      |  2 +-
 .../web/api/picture-in-picture_api/index.md   | 16 +++++----
 .../web/api/pictureinpicturewindow/index.md   |  4 +--
 .../pictureinpictureelement/index.md          | 36 +++++++++++++++++++
 .../picture-in-picture/index.md               | 17 +++++----
 7 files changed, 63 insertions(+), 20 deletions(-)
 create mode 100644 files/zh-cn/web/api/shadowroot/pictureinpictureelement/index.md

diff --git a/files/zh-cn/web/api/document/pictureinpictureelement/index.md b/files/zh-cn/web/api/document/pictureinpictureelement/index.md
index 37bddc42a6f046..58cfa936cf0148 100644
--- a/files/zh-cn/web/api/document/pictureinpictureelement/index.md
+++ b/files/zh-cn/web/api/document/pictureinpictureelement/index.md
@@ -2,7 +2,7 @@
 title: Document：pictureInPictureElement 属性
 slug: Web/API/Document/pictureInPictureElement
 l10n:
-  sourceCommit: 4cbb657f882495b1cd18cbbaa8d1c5237bce4eb8
+  sourceCommit: 20e15ad6027f10c7bdd48f36776876cd1aa3a63c
 ---
 
 {{APIRef("Picture-in-Picture API")}}
@@ -13,7 +13,9 @@ l10n:
 
 ## 值
 
-对于当前处在画中画模式 {{domxref("Element")}} 对象的引用；如果 `document` 在当前并未使用画中画模式，则返回值是 `null`。
+对当前处于画中画模式的 {{domxref("Element")}} 对象的引用。
+
+如果文档没有处于画中画模式的相关元素，则返回 `null`。例如，没有画中画元素，或者画中画元素来自 iframe 中。
 
 ## 示例
 
diff --git a/files/zh-cn/web/api/htmlvideoelement/enterpictureinpicture_event/index.md b/files/zh-cn/web/api/htmlvideoelement/enterpictureinpicture_event/index.md
index 649d65c59db9cd..c6456bea8d507e 100644
--- a/files/zh-cn/web/api/htmlvideoelement/enterpictureinpicture_event/index.md
+++ b/files/zh-cn/web/api/htmlvideoelement/enterpictureinpicture_event/index.md
@@ -2,7 +2,7 @@
 title: HTMLVideoElement：enterpictureinpicture 事件
 slug: Web/API/HTMLVideoElement/enterpictureinpicture_event
 l10n:
-  sourceCommit: 4cbb657f882495b1cd18cbbaa8d1c5237bce4eb8
+  sourceCommit: 73b2b6ee411ac094b9fc57dafac6f9c232fc20d9
 ---
 
 {{APIRef("Picture-in-Picture API")}}
diff --git a/files/zh-cn/web/api/htmlvideoelement/leavepictureinpicture_event/index.md b/files/zh-cn/web/api/htmlvideoelement/leavepictureinpicture_event/index.md
index 473d902cb63d85..47fb8a9e453a50 100644
--- a/files/zh-cn/web/api/htmlvideoelement/leavepictureinpicture_event/index.md
+++ b/files/zh-cn/web/api/htmlvideoelement/leavepictureinpicture_event/index.md
@@ -2,7 +2,7 @@
 title: HTMLVideoElement：leavepictureinpicture 事件
 slug: Web/API/HTMLVideoElement/leavepictureinpicture_event
 l10n:
-  sourceCommit: 4cbb657f882495b1cd18cbbaa8d1c5237bce4eb8
+  sourceCommit: 73b2b6ee411ac094b9fc57dafac6f9c232fc20d9
 ---
 
 {{APIRef("HTMLVideoElement")}}
diff --git a/files/zh-cn/web/api/picture-in-picture_api/index.md b/files/zh-cn/web/api/picture-in-picture_api/index.md
index 7581efea1a8bd8..1f2f823c33abdf 100644
--- a/files/zh-cn/web/api/picture-in-picture_api/index.md
+++ b/files/zh-cn/web/api/picture-in-picture_api/index.md
@@ -1,13 +1,13 @@
 ---
-title: 画中画（Picture-in-Picture）API
+title: 画中画 API
 slug: Web/API/Picture-in-Picture_API
 l10n:
-  sourceCommit: 7c1f91ddd9cd584b041d18a916ab850a226824ad
+  sourceCommit: bb4d21e3c6e71db4e0ba983a450d6ed628e82670
 ---
 
 {{DefaultAPISidebar("Picture-in-Picture API")}}
 
-**画中画 API** 允许网站总是在其他窗口之上创建一个浮动的视频，以便用户在其他内容站点或者设备上的应用程序交互时可以继续播放媒体。
+**画中画 API**（Picture-in-Picture API）允许网站总是在其他窗口之上创建一个浮动的视频，以便用户在其他内容站点或者设备上的应用程序交互时可以继续播放媒体。
 
 > **备注：** [文档画中画 API](/zh-CN/docs/Web/API/Document_Picture-in-Picture_API) 扩展了画中画 API，使其能够将*任意* HTML 内容（而不仅仅是视频）呈现在始终置顶的窗口中。
 
@@ -15,6 +15,8 @@ l10n:
 
 - {{DOMxRef("PictureInPictureWindow")}}
   - : 表示浮动的视频窗口；包含 {{domxref("PictureInPictureWindow/width", "width")}} 和 {{domxref("PictureInPictureWindow/height", "height")}} 属性，以及一个 {{domxref("PictureInPictureWindow/onresize", "onresize")}} 事件处理器属性。
+- {{DOMxRef("PictureInPictureEvent")}}
+  - : 表示画中画相关事件，包括 {{domxref("HTMLVideoElement/enterpictureinpicture_event", "enterpictureinpicture")}}、{{domxref("HTMLVideoElement/leavepictureinpicture_event", "leavepictureinpicture")}} 和 {{domxref("PictureInPictureWindow/resize_event", "resize")}}。
 
 ## 实例方法
 
@@ -60,9 +62,9 @@ _画中画 API 定义了三个事件，它们可以用来检测画中画模式
 - {{domxref("PictureInPictureWindow.resize_event", "resize")}}
   - : 当 {{DOMxRef("PictureInPictureWindow")}} 大小改变时触发该事件。
 
-## 添加控制
+## 添加控件
 
-如果通过[媒体会话 API](/zh-CN/docs/Web/API/Media_Session_API) 设置了媒体操作处理器，则浏览器会在画中画叠加层中自动添加相应操作的控制。例如，如果已设置 `"nexttrack"` 动作，则画中画视图中可能会显示跳过按钮。但该特性不支持添加自定义 HTML 按钮或控件。
+如果通过[媒体会话 API](/zh-CN/docs/Web/API/Media_Session_API) 设置了媒体操作处理器，则浏览器会在画中画叠加层中自动添加相应操作的控件。例如，如果已设置 `"nexttrack"` 动作，则画中画视图中可能会显示跳过按钮。但该特性不支持添加自定义 HTML 按钮或控件。
 
 ## 控制样式
 
@@ -70,7 +72,7 @@ _画中画 API 定义了三个事件，它们可以用来检测画中画模式
 
 ## 控制访问权限
 
-可以使用[权限策略](/zh-CN/docs/Web/HTTP/Permissions_Policy)控制画中画的可用性。全屏模式的特性由字符串 `"picture-in-picture"` 标识，默认的允许列表的值是 `"self"`，意味着在顶级文档上下文以及从与最顶层文档相同的来源加载的嵌套浏览上下文中允许画中画模式。
+可以使用[权限策略](/zh-CN/docs/Web/HTTP/Permissions_Policy)控制画中画的可用性。全屏模式的特性由字符串 `"picture-in-picture"` 标识，默认的允许列表的值是 `*`，意味着在顶级文档上下文以及从与最顶层文档相同的来源加载的嵌套浏览上下文中允许画中画模式。
 
 ## 示例
 
@@ -80,7 +82,7 @@ _画中画 API 定义了三个事件，它们可以用来检测画中画模式
 
 ### 切换画中画模式
 
-当使用者点击“Toggle Picture-in-Picture”按钮时，这段代码将会由一个点击处理程序调用：
+当使用者点击“Toggle Picture-in-Picture”按钮时，这段代码将会由一个点击处理器调用：
 
 ```js
 function togglePictureInPicture() {
diff --git a/files/zh-cn/web/api/pictureinpicturewindow/index.md b/files/zh-cn/web/api/pictureinpicturewindow/index.md
index d599d62caeb70b..8438a0b1c5291d 100644
--- a/files/zh-cn/web/api/pictureinpicturewindow/index.md
+++ b/files/zh-cn/web/api/pictureinpicturewindow/index.md
@@ -2,7 +2,7 @@
 title: PictureInPictureWindow
 slug: Web/API/PictureInPictureWindow
 l10n:
-  sourceCommit: acfe8c9f1f4145f77653a2bc64a9744b001358dc
+  sourceCommit: 73b2b6ee411ac094b9fc57dafac6f9c232fc20d9
 ---
 
 {{APIRef("Picture-in-Picture API")}}
@@ -31,7 +31,7 @@ _`PictureInPictureWindow` 接口不继承任何方法。_
 _`PictureInPictureWindow` 接口不继承任何事件。_
 
 - {{domxref("PictureInPictureWindow.resize_event", "resize")}}
-  - : 当浮动视频窗口的大小改变时，发送给 {{DOMxRef("PictureInPictureWindow")}}。
+  - : 当浮动视频窗口的大小改变时，发送给 `PictureInPictureWindow`。
 
 ## 示例
 
diff --git a/files/zh-cn/web/api/shadowroot/pictureinpictureelement/index.md b/files/zh-cn/web/api/shadowroot/pictureinpictureelement/index.md
new file mode 100644
index 00000000000000..6ae7d84ad19666
--- /dev/null
+++ b/files/zh-cn/web/api/shadowroot/pictureinpictureelement/index.md
@@ -0,0 +1,36 @@
+---
+title: ShadowRoot：pictureInPictureElement 属性
+slug: Web/API/ShadowRoot/pictureInPictureElement
+l10n:
+  sourceCommit: bb4d21e3c6e71db4e0ba983a450d6ed628e82670
+---
+
+{{APIRef("Picture-in-Picture API")}}
+
+{{domxref("ShadowRoot")}} 接口的 **`pictureInPictureElement`** 只读属性返回此影子树中当前以画中画模式呈现的 {{domxref("Element")}}，如果当前未使用画中画模式，则返回 `null`。
+
+## 值
+
+对当前处于画中画模式的 {{domxref("Element")}} 对象的引用。
+
+如果影子树在画中画模式中没有关联元素，则返回 `null`。例如，没有画中画元素，或者画中画元素不在影子树中。
+
+## 示例
+
+```js
+let customElem = document.querySelector("my-shadow-dom-element");
+let shadow = customElem.shadowRoot;
+let pipElem = shadow.pictureInPictureElement;
+```
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- {{domxref("Document.pictureInPictureElement")}}
diff --git a/files/zh-cn/web/http/headers/permissions-policy/picture-in-picture/index.md b/files/zh-cn/web/http/headers/permissions-policy/picture-in-picture/index.md
index f9e6f6e3b6fc07..8f4200f144813b 100644
--- a/files/zh-cn/web/http/headers/permissions-policy/picture-in-picture/index.md
+++ b/files/zh-cn/web/http/headers/permissions-policy/picture-in-picture/index.md
@@ -1,24 +1,28 @@
 ---
 title: "Permissions-Policy: picture-in-picture"
 slug: Web/HTTP/Headers/Permissions-Policy/picture-in-picture
+l10n:
+  sourceCommit: 0880a90f3811475d78bc4b2c344eb4146f25f66c
 ---
 
 {{HTTPSidebar}} {{SeeCompatTable}}
 
-HTTP 标头 {{HTTPHeader("Permissions-Policy")}} 的 `picture-in-picture` 指令表示是否允许当前的文档通过相应的 API 以画中画模式播放视频。
+HTTP {{HTTPHeader("Permissions-Policy")}} 标头 `picture-in-picture` 指令控制是否允许当前文档以{{domxref("Picture-in-Picture API", "画中画", "", "nocode")}}模式播放视频。
+
+具体而言，如果定义的策略阻止使用此特性，则 {{domxref("HTMLVideoElement.requestPictureInPicture()")}} 调用将抛出类型为 `SecurityError` 的 {{domxref("DOMException")}} 错误。
 
 ## 语法
 
 ```http
-Permissions-Policy: picture-in-picture <allowlist>;
+Permissions-Policy: picture-in-picture=<allowlist>;
 ```
 
-- \<allowlist>
-  - : 允许使用该功能的来源列表。参见 [`Permissions-Policy`](/zh-CN/docs/Web/HTTP/Headers/Permissions-Policy#语法)。
+- `<allowlist>`
+  - : 允许使用该特性的来源列表。有关更多详细信息，参阅 [`Permissions-Policy` > 语法](/zh-CN/docs/Web/HTTP/Headers/Permissions-Policy#语法)。
 
 ## 默认策略
 
-截至 2019 年 6 月，[规范草案](https://wicg.github.io/picture-in-picture/#feature-policy) 和 [Google Chrome](https://bugs.chromium.org/p/chromium/issues/detail?id=806249#c17) 将允许列表默认设置为 `*`。
+`picture-in-picture` 的默认允许列表是 `*`。
 
 ## 规范
 
@@ -31,5 +35,4 @@ Permissions-Policy: picture-in-picture <allowlist>;
 ## 参见
 
 - {{HTTPHeader("Permissions-Policy")}} 标头
-- [Permission Policy](/zh-CN/docs/Web/HTTP/Feature_Policy)
-- [Using Permission Policy](/zh-CN/docs/Web/HTTP/Feature_Policy/Using_Feature_Policy)
+- [权限策略](/zh-CN/docs/Web/HTTP/Permissions_Policy)

From 78869181c3628b146f12b15bba77b8661280b37e Mon Sep 17 00:00:00 2001
From: Chunhui Fu <fuchuhu7@gmail.com>
Date: Fri, 27 Sep 2024 23:08:43 +0800
Subject: [PATCH 03/43] [zh-cn]: add table example (#23775)

Co-authored-by: A1lo <yin199909@aliyun.com>
---
 files/zh-cn/web/css/_colon_nth-child/index.md | 59 ++++++++++++++++++-
 1 file changed, 58 insertions(+), 1 deletion(-)

diff --git a/files/zh-cn/web/css/_colon_nth-child/index.md b/files/zh-cn/web/css/_colon_nth-child/index.md
index d25971c7dad32f..3549a8c1187c6c 100644
--- a/files/zh-cn/web/css/_colon_nth-child/index.md
+++ b/files/zh-cn/web/css/_colon_nth-child/index.md
@@ -2,7 +2,7 @@
 title: ":nth-child()"
 slug: Web/CSS/:nth-child
 l10n:
-  sourceCommit: d546a54139681cad9b176db2ca494b6a6bb8f7c6
+  sourceCommit: 4cb569f768ec9529724f8fb06539f2903a583a41
 ---
 
 {{CSSRef}}
@@ -409,6 +409,63 @@ td {
 
 {{EmbedLiveSample('使用 of selector 修复条纹表格', 550, 180)}}
 
+### 为表格列添加样式
+
+要设置表格列的样式，你不能在 {{HTMLElement("col")}} 元素上设置样式，因为表格单元格不是它的子元素（就像你可以使用行元素 {{HTMLElement("tr")}}一样）。像 `:nth-child()` 这样的伪类可以方便地选择列单元格。
+
+在这个例子中，我们为每个列设置不同的样式。
+
+#### HTML
+
+```html-nolint
+<table>
+<caption>学生名册</caption>
+<colgroup>
+  <col/>
+  <col/>
+  <col/>
+</colgroup>
+  <thead>
+    <tr><th>姓名</th><th>年龄</th><th>国家</th></tr>
+  </thead>
+  <tbody>
+    <tr><td>Mamitiana</td><td>23</td><td>马达加斯加</td></tr>
+    <tr><td>Yuki</td><td>48</td><td>日本</td></tr>
+  </tbody>
+</table>
+```
+
+#### CSS
+
+```css
+td {
+  padding: 0.125rem 0.5rem;
+  height: 3rem;
+  border: 1px solid black;
+}
+
+tr :nth-child(1) {
+  text-align: left;
+  vertical-align: bottom;
+  background-color: silver;
+}
+
+tbody tr :nth-child(2) {
+  text-align: center;
+  vertical-align: middle;
+}
+
+tbody tr :nth-child(3) {
+  text-align: right;
+  vertical-align: top;
+  background-color: tomato;
+}
+```
+
+#### 结果
+
+{{EmbedLiveSample('为表格列添加样式', 100, 200)}}
+
 ## 规范
 
 {{Specifications}}

From af60e0ee2c513aaa748abb262bc3bf2a58502a6e Mon Sep 17 00:00:00 2001
From: mdn-bot <108879845+mdn-bot@users.noreply.github.com>
Date: Fri, 27 Sep 2024 01:30:16 +0000
Subject: [PATCH 04/43] zh-cn: sync translated content

---
 files/zh-cn/_redirects.txt                                | 4 +++-
 files/zh-cn/_wikihistory.json                             | 8 ++++----
 files/zh-cn/web/api/{ => window}/queuemicrotask/index.md  | 3 ++-
 files/zh-cn/web/api/{ => window}/structuredclone/index.md | 3 ++-
 4 files changed, 11 insertions(+), 7 deletions(-)
 rename files/zh-cn/web/api/{ => window}/queuemicrotask/index.md (97%)
 rename files/zh-cn/web/api/{ => window}/structuredclone/index.md (98%)

diff --git a/files/zh-cn/_redirects.txt b/files/zh-cn/_redirects.txt
index 38e8ba5e86d3bb..1380fbf848ab74 100644
--- a/files/zh-cn/_redirects.txt
+++ b/files/zh-cn/_redirects.txt
@@ -1909,7 +1909,7 @@
 /zh-CN/docs/Web/API/WindowOrWorkerGlobalScope/indexedDB	/zh-CN/docs/Web/API/Window/indexedDB
 /zh-CN/docs/Web/API/WindowOrWorkerGlobalScope/isSecureContext	/zh-CN/docs/Web/API/Window/isSecureContext
 /zh-CN/docs/Web/API/WindowOrWorkerGlobalScope/origin	/zh-CN/docs/Web/API/Window/origin
-/zh-CN/docs/Web/API/WindowOrWorkerGlobalScope/queueMicrotask	/zh-CN/docs/Web/API/queueMicrotask
+/zh-CN/docs/Web/API/WindowOrWorkerGlobalScope/queueMicrotask	/zh-CN/docs/Web/API/Window/queueMicrotask
 /zh-CN/docs/Web/API/WindowOrWorkerGlobalScope/setInterval	/zh-CN/docs/Web/API/setInterval
 /zh-CN/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout	/zh-CN/docs/Web/API/setTimeout
 /zh-CN/docs/Web/API/WindowTimers/clearTimeout	/zh-CN/docs/Web/API/clearTimeout
@@ -2034,9 +2034,11 @@
 /zh-CN/docs/Web/API/notification/onshow	/zh-CN/docs/Web/API/Notification/show_event
 /zh-CN/docs/Web/API/origin	/zh-CN/docs/Web/API/Window/origin
 /zh-CN/docs/Web/API/performance_property	/zh-CN/docs/Web/API/Window/performance
+/zh-CN/docs/Web/API/queueMicrotask	/zh-CN/docs/Web/API/Window/queueMicrotask
 /zh-CN/docs/Web/API/range.getBoundingClientRect	/zh-CN/docs/Web/API/Range/getBoundingClientRect
 /zh-CN/docs/Web/API/range.startOffset	/zh-CN/docs/Web/API/Range/startOffset
 /zh-CN/docs/Web/API/range.surroundContents	/zh-CN/docs/Web/API/Range/surroundContents
+/zh-CN/docs/Web/API/structuredClone	/zh-CN/docs/Web/API/Window/structuredClone
 /zh-CN/docs/Web/API/window.requestAnimationFrame	/zh-CN/docs/Web/API/Window/requestAnimationFrame
 /zh-CN/docs/Web/API/剪贴板_API	/zh-CN/docs/Web/API/Clipboard_API
 /zh-CN/docs/Web/API/开发式平台	/zh-CN/docs/Web/API/Push_API
diff --git a/files/zh-cn/_wikihistory.json b/files/zh-cn/_wikihistory.json
index 766f8f134f0066..ca036768227942 100644
--- a/files/zh-cn/_wikihistory.json
+++ b/files/zh-cn/_wikihistory.json
@@ -15561,6 +15561,10 @@
     "modified": "2019-03-24T00:15:16.672Z",
     "contributors": ["guoyi", "jjc", "teoli", "khalid32", "ziyunfei"]
   },
+  "Web/API/Window/queueMicrotask": {
+    "modified": "2020-10-15T22:23:11.878Z",
+    "contributors": ["RainSlide"]
+  },
   "Web/API/Window/rejectionhandled_event": {
     "modified": "2020-10-15T22:26:00.037Z",
     "contributors": ["mengli404"]
@@ -16280,10 +16284,6 @@
       "Hawkeyes_Wind"
     ]
   },
-  "Web/API/queueMicrotask": {
-    "modified": "2020-10-15T22:23:11.878Z",
-    "contributors": ["RainSlide"]
-  },
   "Web/API/setInterval": {
     "modified": "2020-11-25T18:16:55.949Z",
     "contributors": [
diff --git a/files/zh-cn/web/api/queuemicrotask/index.md b/files/zh-cn/web/api/window/queuemicrotask/index.md
similarity index 97%
rename from files/zh-cn/web/api/queuemicrotask/index.md
rename to files/zh-cn/web/api/window/queuemicrotask/index.md
index f2c72f10b67743..88a5377d13adb2 100644
--- a/files/zh-cn/web/api/queuemicrotask/index.md
+++ b/files/zh-cn/web/api/window/queuemicrotask/index.md
@@ -1,6 +1,7 @@
 ---
 title: queueMicrotask()
-slug: Web/API/queueMicrotask
+slug: Web/API/Window/queueMicrotask
+original_slug: Web/API/queueMicrotask
 ---
 
 {{APIRef("HTML DOM")}}
diff --git a/files/zh-cn/web/api/structuredclone/index.md b/files/zh-cn/web/api/window/structuredclone/index.md
similarity index 98%
rename from files/zh-cn/web/api/structuredclone/index.md
rename to files/zh-cn/web/api/window/structuredclone/index.md
index 5b3d155b80e6e9..4fead1870b1873 100644
--- a/files/zh-cn/web/api/structuredclone/index.md
+++ b/files/zh-cn/web/api/window/structuredclone/index.md
@@ -1,6 +1,7 @@
 ---
 title: structuredClone()
-slug: Web/API/structuredClone
+slug: Web/API/Window/structuredClone
+original_slug: Web/API/structuredClone
 ---
 
 {{APIRef("HTML DOM")}}{{AvailableInWorkers}}

From 649e02410fec8bde2749bbb70f462acedda10491 Mon Sep 17 00:00:00 2001
From: Allo <yin199909@aliyun.com>
Date: Fri, 27 Sep 2024 22:35:49 +0800
Subject: [PATCH 05/43] zh-cn: resolve the global function `queueMicrotask()`

ref: mdn/content#35929
---
 .../microtask_guide/in_depth/index.md         |  2 +-
 .../api/html_dom_api/microtask_guide/index.md | 18 ++---
 files/zh-cn/web/api/settimeout/index.md       |  5 +-
 .../index.md                                  |  4 +-
 files/zh-cn/web/api/web_workers_api/index.md  |  4 +-
 .../web/api/window/queuemicrotask/index.md    | 28 ++++---
 .../workerglobalscope/queuemicrotask/index.md | 79 +++++++++++++++++++
 .../javascript/guide/using_promises/index.md  |  2 +-
 8 files changed, 111 insertions(+), 31 deletions(-)
 create mode 100644 files/zh-cn/web/api/workerglobalscope/queuemicrotask/index.md

diff --git a/files/zh-cn/web/api/html_dom_api/microtask_guide/in_depth/index.md b/files/zh-cn/web/api/html_dom_api/microtask_guide/in_depth/index.md
index 7545b350abca02..80dae2da6338f6 100644
--- a/files/zh-cn/web/api/html_dom_api/microtask_guide/in_depth/index.md
+++ b/files/zh-cn/web/api/html_dom_api/microtask_guide/in_depth/index.md
@@ -144,7 +144,7 @@ greetUser("Veronica");
 ## 参见
 
 - [微任务指南](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)
-- {{domxref("queueMicrotask()")}}
+- {{domxref("Window.queueMicrotask()")}}
 - [异步 JavaScript](/zh-CN/docs/Learn/JavaScript/Asynchronous)
   - [异步 JavaScript 简介](/zh-CN/docs/Learn/JavaScript/Asynchronous/Introducing)
   - [合作的异步 JavaScript：超时和间隔](/zh-CN/docs/Learn/JavaScript/Asynchronous)
diff --git a/files/zh-cn/web/api/html_dom_api/microtask_guide/index.md b/files/zh-cn/web/api/html_dom_api/microtask_guide/index.md
index 0a8247cb103b4f..04adaff6dd73ee 100644
--- a/files/zh-cn/web/api/html_dom_api/microtask_guide/index.md
+++ b/files/zh-cn/web/api/html_dom_api/microtask_guide/index.md
@@ -7,7 +7,7 @@ slug: Web/API/HTML_DOM_API/Microtask_guide
 
 一个**微任务**（microtask）就是一个简短的函数，当创建该微任务的函数执行之后，*并且*只有当 Javascript 调用栈为空，而控制权尚未返还给被{{Glossary("user agent", "用户代理")}}用来驱动脚本执行环境的事件循环之前，该微任务才会被执行。事件循环既可能是浏览器的主事件循环也可能是被一个 [web worker](/zh-CN/docs/Web/API/Web_Workers_API) 所驱动的事件循环。这使得给定的函数在没有其他脚本执行干扰的情况下运行，也保证了微任务能在用户代理有机会对该微任务带来的行为做出反应之前运行。
 
-JavaScript 中的 [promise](/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise) 和 [Mutation Observer API](/zh-CN/docs/Web/API/MutationObserver) 都使用微任务队列去运行它们的回调函数，但当能够推迟工作直到当前事件循环过程完结时，也是可以执行微任务的时机。为了允许第三方库、框架、polyfill 能使用微任务，在 {{domxref("Window")}} 和 {{domxref("Worker")}} 接口上暴露了 {{domxref("queueMicrotask()")}} 方法。
+JavaScript 中的 [promise](/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise) 和 [Mutation Observer API](/zh-CN/docs/Web/API/MutationObserver) 都使用微任务队列去运行它们的回调函数，但当能够推迟工作直到当前事件循环过程完结时，也是可以执行微任务的时机。为了允许第三方库、框架、polyfill 能使用微任务，在 {{domxref("Window")}} 和 {{domxref("WorkerGlobalScope")}} 接口上暴露了 {{domxref("Window.queueMicrotask()", "queueMicrotask()")}} 方法。
 
 ## 任务 vs 微任务
 
@@ -33,7 +33,7 @@ JavaScript 中的 [promise](/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/
 
 首先，每当一个任务存在，事件循环都会检查该任务是否正把控制权交给其他 JavaScript 代码。如若不然，事件循环就会运行微任务队列中的所有微任务。接下来微任务循环会在事件循环的每次迭代中被处理多次，包括处理完事件和其他回调之后。
 
-其次，如果一个微任务通过调用 {{domxref("queueMicrotask()")}}, 向队列中加入了更多的微任务，则那些新加入的微任务 _会早于下一个任务运行_。这是因为事件循环会持续调用微任务直至队列中没有留存的，即使是在有更多微任务持续被加入的情况下。
+其次，如果一个微任务通过调用 {{domxref("Window.queueMicrotask()", "queueMicrotask()")}}，向队列中加入了更多的微任务，则那些新加入的微任务*会早于下一个任务运行*。这是因为事件循环会持续调用微任务直至队列中没有留存的，即使是在有更多微任务持续被加入的情况下。
 
 > [!WARNING]
 > 因为微任务自身可以入列更多的微任务，且事件循环会持续处理微任务直至队列为空，那么就存在一种使得事件循环无尽处理微任务的真实风险。如何处理递归增加微任务是要谨慎而行的。
@@ -44,11 +44,11 @@ JavaScript 中的 [promise](/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/
 
 ### 入列微任务
 
-就其本身而言，应该使用微任务的典型情况，要么只有在没有其他办法的时候，要么是当创建框架或库时需要使用微任务达成其功能。虽然在过去要使得入列微任务成为可能有可用的技巧（比如创建一个立即 resolve 的 promise），但新加入的 {{domxref("queueMicrotask()")}} 方法增加了一种标准的方式，可以安全的引入微任务而避免使用额外的技巧。
+就其本身而言，应该使用微任务的典型情况，要么只有在没有其他办法的时候，要么是当创建框架或库时需要使用微任务达成其功能。虽然在过去要使得入列微任务成为可能有可用的技巧（比如创建一个立即兑现的 promise），但新加入的 {{domxref("Window.queueMicrotask()", "queueMicrotask()")}} 方法增加了一种标准的方式，可以安全的引入微任务而避免使用额外的技巧。
 
 通过引入 `queueMicrotask()`，由晦涩地使用 promise 去创建微任务而带来的风险就可以被避免了。举例来说，当使用 promise 创建微任务时，由回调抛出的异常被报告为 rejected promises 而不是标准异常。同时，创建和销毁 promise 带来了事件和内存方面的额外开销，这是正确入列微任务的函数应该避免的。
 
-简单的传入一个 JavaScript {{jsxref("Function")}} ，以在 `queueMicrotask()` 方法中处理微任务时供其上下文调用即可；取决于当前执行上下文， `queueMicrotask()` 以定义的形式被暴露在 {{domxref("Window")}} 或 {{domxref("Worker")}} 接口上。
+简单的传入一个 JavaScript {{jsxref("Function")}}，以在 `queueMicrotask()` 方法中处理微任务时供其上下文调用即可；取决于当前执行上下文，`queueMicrotask()` 以定义的形式被暴露在 {{domxref("Window")}} 或 {{domxref("Worker")}} 接口上。
 
 ```js
 queueMicrotask(() => {
@@ -175,9 +175,7 @@ let sendMessage = (message) => {
 };
 ```
 
-当 `sendMessage()`
-
-被调用时，指定的消息首先被推入消息队列数组。接着事情就变得有趣了。
+当 `sendMessage()` 被调用时，指定的消息首先被推入消息队列数组。接着事情就变得有趣了。
 
 如果我们刚加入数组的消息是第一条，就入列一个将会发送一个批处理的微任务。照旧，当 JavaScript 执行路径到达顶层，恰在运行回调之前，那个微任务将会执行。这意味着之后的间歇期内造成的对 `sendMessage()` 的任何调用都会将其各自的消息推入消息队列，但囿于入列微任务逻辑之前的数组长度检查，不会有新的微任务入列。
 
@@ -204,7 +202,7 @@ let logElem = document.getElementById("log");
 let log = (s) => (logElem.innerHTML += s + "<br>");
 ```
 
-在下面的代码中，我们看到对 {{domxref("queueMicrotask()")}} 的一次调用被用来调度一个微任务以使其运行。这次调用包含了 `log()`，一个简单的向屏幕输出文字的自定义函数。
+在下面的代码中，我们看到对 {{domxref("Window.queueMicrotask()", "queueMicrotask()")}} 的一次调用被用来调度一个微任务以使其运行。这次调用包含了 `log()`，一个简单的向屏幕输出文字的自定义函数。
 
 ```js
 log("Before enqueueing the microtask");
@@ -233,7 +231,7 @@ let logElem = document.getElementById("log");
 let log = (s) => (logElem.innerHTML += s + "<br>");
 ```
 
-在下面的代码中，我们看到对 {{domxref("queueMicrotask()")}} 的一次调用被用来调度一个微任务以使其运行。这次调用包含了 `log()`，一个简单的向屏幕输出文字的自定义函数。
+在下面的代码中，我们看到对 {{domxref("Window.queueMicrotask()", "queueMicrotask()")}} 的一次调用被用来调度一个微任务以使其运行。这次调用包含了 `log()`，一个简单的向屏幕输出文字的自定义函数。
 
 以下代码调度了一个 0 毫秒后触发的 timeout，而后入列了一个微任务。前后被对 `log()` 的调用包住，输出附加的信息。
 
@@ -300,7 +298,7 @@ log("Main program exiting");
 ## 参见
 
 - [In depth: Microtasks and the JavaScript runtime environment](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide/In_depth)
-- {{domxref("queueMicrotask()")}}
+- {{domxref("Window.queueMicrotask()", "queueMicrotask()")}}
 - [Asynchronous JavaScript](/zh-CN/docs/Learn/JavaScript/Asynchronous)
 
   - [General asynchronous programming concepts](/zh-CN/docs/Learn/JavaScript/Asynchronous/Concepts)
diff --git a/files/zh-cn/web/api/settimeout/index.md b/files/zh-cn/web/api/settimeout/index.md
index ffe5da1850c84f..53526cbf25c023 100644
--- a/files/zh-cn/web/api/settimeout/index.md
+++ b/files/zh-cn/web/api/settimeout/index.md
@@ -385,5 +385,6 @@ function clearMessage() {
 - [`core-js` 中允许向回调函数传递参数的 `setTimeout` 版本的 polyfill](https://github.com/zloirock/core-js#settimeout-and-setinterval)
 - {{domxref("clearTimeout")}}
 - {{domxref("setInterval()")}}
-- {{domxref("window.requestAnimationFrame")}}
-- {{domxref("queueMicrotask()")}}
+- {{domxref("Window.requestAnimationFrame")}}
+- {{domxref("Window.queueMicrotask()")}}
+- {{domxref("WorkerGlobalScope.queueMicrotask()")}}
diff --git a/files/zh-cn/web/api/web_workers_api/functions_and_classes_available_to_workers/index.md b/files/zh-cn/web/api/web_workers_api/functions_and_classes_available_to_workers/index.md
index e3676dd8c0c74d..61f8540a831182 100644
--- a/files/zh-cn/web/api/web_workers_api/functions_and_classes_available_to_workers/index.md
+++ b/files/zh-cn/web/api/web_workers_api/functions_and_classes_available_to_workers/index.md
@@ -23,8 +23,8 @@ slug: Web/API/Web_Workers_API/Functions_and_classes_available_to_workers
 - {{domxref("clearTimeout()")}}
 - {{domxref("createImageBitmap()")}}
 - {{domxref("WorkerGlobalScope.dump()", "dump()")}} {{non-standard_inline}}
-- {{domxref("fetch()")}}
-- {{domxref("queueMicrotask()")}}
+- {{domxref("WorkerGlobalScope.fetch()", "fetch()")}}
+- {{domxref("WorkerGlobalScope.queueMicrotask()", "queueMicrotask()")}}
 - {{domxref("reportError()")}}
 - {{domxref("setInterval()")}}
 - {{domxref("setTimeout()")}}
diff --git a/files/zh-cn/web/api/web_workers_api/index.md b/files/zh-cn/web/api/web_workers_api/index.md
index 9a2279b3599a68..e5295d1f14fd64 100644
--- a/files/zh-cn/web/api/web_workers_api/index.md
+++ b/files/zh-cn/web/api/web_workers_api/index.md
@@ -44,8 +44,8 @@ worker 在一个与当前 {{DOMxRef("window")}} 不同的全局上下文中运
 - {{domxref("clearTimeout()")}}
 - {{domxref("createImageBitmap()")}}
 - {{domxref("WorkerGlobalScope.dump()", "dump()")}} {{non-standard_inline}}
-- {{domxref("fetch()")}}
-- {{domxref("queueMicrotask()")}}
+- {{domxref("WorkerGlobalScope.fetch()", "fetch()")}}
+- {{domxref("WorkerGlobalScope.queueMicrotask()", "queueMicrotask()")}}
 - {{domxref("reportError()")}}
 - {{domxref("setInterval()")}}
 - {{domxref("setTimeout()")}}
diff --git a/files/zh-cn/web/api/window/queuemicrotask/index.md b/files/zh-cn/web/api/window/queuemicrotask/index.md
index 88a5377d13adb2..397d190ee38997 100644
--- a/files/zh-cn/web/api/window/queuemicrotask/index.md
+++ b/files/zh-cn/web/api/window/queuemicrotask/index.md
@@ -1,31 +1,32 @@
 ---
-title: queueMicrotask()
+title: Window：queueMicrotask() 方法
 slug: Web/API/Window/queueMicrotask
-original_slug: Web/API/queueMicrotask
+l10n:
+  sourceCommit: 5fc275a2cb01ea3c361d6a0af057e96a00122984
 ---
 
 {{APIRef("HTML DOM")}}
 
-{{domxref("Window")}} 或 {{domxref("Worker")}} 接口的 **`queueMicrotask()`** 方法，将微任务加入队列以在控制返回浏览器的事件循环之前的安全时间执行。
+{{domxref("Window")}} 接口的 **`queueMicrotask()`** 方法，将微任务加入队列以在控制返回浏览器的事件循环之前的安全时间执行。
 
 微任务是一个简短的函数，它将在当前任务完成其工作后运行，并且在执行上下文的控制权返回到浏览器的事件循环之前没有其他代码等待运行时运行。
 
 它让你的代码在运行时不会干扰任何可能具有更高优先级的代码的运行，但在浏览器重新获得对执行上下文的控制之前，这可能取决于你需要完成的工作。你可以在我们的[微任务指南](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)中了解更多关于如何使用微任务以及选择这样做的原因。
 
-微任务的重要性在于它能够以特定顺序异步执行任务。查看[在 JavaScript 中通过 queueMicrotask() 使用微任务](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)的详情。
+微任务的重要性在于它能够以特定顺序异步执行任务。参见[在 JavaScript 中通过 `queueMicrotask()` 使用微任务](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)以了解更多信息。
 
 微任务对于需要执行最后阶段的任务或其他在渲染之前的任务的库和框架特别有用。
 
 ## 语法
 
-```plain
-queueMicrotask(() => {/* ... */});
+```js-nolint
+queueMicrotask(callback)
 ```
 
 ### 参数
 
 - `function`
-  - : 当浏览器引擎确定可以安全调用你的代码时执行的 {{jsxref("function")}}。微任务（microtask）的执行顺序在所有进行中的任务（pending task）完成之后，在对浏览器的事件循环产生控制（yielding control to the browser's event loop）之前。
+  - : 当浏览器引擎确定可以安全调用你的代码时执行的 {{jsxref("function")}}。微任务（microtask）的执行顺序在所有进行中的任务（pending task）完成之后，在对浏览器的事件循环产生控制之前。
 
 ### 返回值
 
@@ -39,7 +40,7 @@ queueMicrotask(() => {
 });
 ```
 
-来自 [`queueMicrotask` 的规范文档：](https://html.spec.whatwg.org/multipage/timers-and-user-prompts.html#microtask-queuing)
+来自 [queueMicrotask 的规范](https://html.spec.whatwg.org/multipage/timers-and-user-prompts.html#microtask-queuing)：
 
 ```js
 MyElement.prototype.loadData = function (url) {
@@ -70,8 +71,9 @@ MyElement.prototype.loadData = function (url) {
 
 ## 参见
 
-- [Polyfill of `queueMicrotask()` in `core-js`](https://github.com/zloirock/core-js#queuemicrotask)
-- [Using microtasks in JavaScript with queueMicrotask()](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)
-- [Asynchronous JavaScript](/zh-CN/docs/Learn/JavaScript/Asynchronous)
-- [queueMicrotask explainer](https://github.com/fergald/docs/blob/master/explainers/queueMicrotask.md)
-- [Tasks, microtasks, queues and schedules](https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/) by Jake Archibald
+- {{domxref("WorkerGlobalScope.queueMicrotask()")}}
+- [`core-js` 中 `queueMicrotask()` 的 polyfill](https://github.com/zloirock/core-js#queuemicrotask)
+- [在 JavaScript 中通过 queueMicrotask() 使用微任务](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)
+- [异步 JavaScript](/zh-CN/docs/Learn/JavaScript/Asynchronous)
+- [queueMicrotask 的解释](https://github.com/fergald/docs/blob/master/explainers/queueMicrotask.md)
+- [任务、微任务、队列和调度](https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/)（作者：Jake Archibald）
diff --git a/files/zh-cn/web/api/workerglobalscope/queuemicrotask/index.md b/files/zh-cn/web/api/workerglobalscope/queuemicrotask/index.md
new file mode 100644
index 00000000000000..439668fe66f2d7
--- /dev/null
+++ b/files/zh-cn/web/api/workerglobalscope/queuemicrotask/index.md
@@ -0,0 +1,79 @@
+---
+title: WorkerGlobalScope：queueMicrotask() 方法
+slug: Web/API/WorkerGlobalScope/queueMicrotask
+l10n:
+  sourceCommit: 5fc275a2cb01ea3c361d6a0af057e96a00122984
+---
+
+{{APIRef("Web Workers API")}}{{AvailableInWorkers("worker")}}
+
+{{domxref("WorkerGlobalScope")}} 接口的 **`queueMicrotask()`** 方法，将微任务加入队列以在控制返回浏览器的事件循环之前的安全时间执行。
+
+微任务是一个简短的函数，它将在当前任务完成其工作后运行，并且在执行上下文的控制权返回到浏览器的事件循环之前没有其他代码等待运行时运行。
+
+它让你的代码在运行时不会干扰任何可能具有更高优先级的代码的运行，但在浏览器重新获得对执行上下文的控制之前，这可能取决于你需要完成的工作。你可以在我们的[微任务指南](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)中了解更多关于如何使用微任务以及选择这样做的原因。
+
+微任务的重要性在于它能够以特定顺序异步执行任务。参见[在 JavaScript 中通过 `queueMicrotask()` 使用微任务](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)以了解更多信息。
+
+微任务对于需要执行最后阶段的任务或其他在渲染之前的任务的库和框架特别有用。
+
+## 语法
+
+```js-nolint
+queueMicrotask(callback)
+```
+
+### 参数
+
+- `function`
+  - : 当浏览器引擎确定可以安全调用你的代码时执行的 {{jsxref("function")}}。微任务（microtask）的执行顺序在所有进行中的任务（pending task）完成之后，在对浏览器的事件循环产生控制之前。
+
+### 返回值
+
+无（{{jsxref("undefined")}}）。
+
+## 示例
+
+```js
+queueMicrotask(() => {
+  // 函数的内容
+});
+```
+
+来自 [queueMicrotask 的规范](https://html.spec.whatwg.org/multipage/timers-and-user-prompts.html#microtask-queuing)：
+
+```js
+MyElement.prototype.loadData = function (url) {
+  if (this._cache[url]) {
+    queueMicrotask(() => {
+      this._setData(this._cache[url]);
+      this.dispatchEvent(new Event("load"));
+    });
+  } else {
+    fetch(url)
+      .then((res) => res.arrayBuffer())
+      .then((data) => {
+        this._cache[url] = data;
+        this._setData(data);
+        this.dispatchEvent(new Event("load"));
+      });
+  }
+};
+```
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- {{domxref("Window.queueMicrotask()")}}
+- [`core-js` 中 `queueMicrotask()` 的 polyfill](https://github.com/zloirock/core-js#queuemicrotask)
+- [在 JavaScript 中通过 queueMicrotask() 使用微任务](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)
+- [异步 JavaScript](/zh-CN/docs/Learn/JavaScript/Asynchronous)
+- [queueMicrotask 的解释](https://github.com/fergald/docs/blob/master/explainers/queueMicrotask.md)
+- [任务、微任务、队列和调度](https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/)（作者：Jake Archibald）
diff --git a/files/zh-cn/web/javascript/guide/using_promises/index.md b/files/zh-cn/web/javascript/guide/using_promises/index.md
index 19a72bf6bb5b13..3b891cfb145dd7 100644
--- a/files/zh-cn/web/javascript/guide/using_promises/index.md
+++ b/files/zh-cn/web/javascript/guide/using_promises/index.md
@@ -542,7 +542,7 @@ Promise 回调（.then）
 
 你可能遇到如下情况：你的一些 Promise 和任务（例如事件或回调）会以不可预测的顺序启动。此时，你或许可以通过使用微任务检查状态或平衡 Promise，并以此有条件地创建 Promise。
 
-如果你认为微任务可能会帮助你解决问题，那么请阅读[微任务指南](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)，学习如何用 [`queueMicrotask()`](/zh-CN/docs/Web/API/queueMicrotask) 来将一个函数作为微任务添加到队列中。
+如果你认为微任务可能会帮助你解决问题，那么请阅读[微任务指南](/zh-CN/docs/Web/API/HTML_DOM_API/Microtask_guide)，学习如何用 {{domxref("Window.queueMicrotask()", "queueMicrotask()")}} 来将一个函数作为微任务添加到队列中。
 
 ## 参见
 

From 1ad0926da3c8e2f55586551e5ec0068fc1490946 Mon Sep 17 00:00:00 2001
From: Allo <yin199909@aliyun.com>
Date: Fri, 27 Sep 2024 23:07:58 +0800
Subject: [PATCH 06/43] zh-cn: resolve the global function `structuredClone()`

ref: mdn/content#35951
---
 files/zh-cn/glossary/deep_copy/index.md       | 10 +--
 .../glossary/serializable_object/index.md     |  2 +-
 files/zh-cn/web/api/domexception/index.md     |  2 +-
 .../index.md                                  |  2 +-
 files/zh-cn/web/api/web_workers_api/index.md  |  2 +-
 .../structured_clone_algorithm/index.md       |  3 +-
 .../transferable_objects/index.md             |  4 +-
 .../web/api/window/structuredclone/index.md   | 57 +++++++++--------
 .../structuredclone/index.md                  | 61 +++++++++++++++++++
 .../reference/global_objects/array/index.md   |  2 +-
 .../global_objects/evalerror/index.md         |  2 +-
 .../global_objects/json/stringify/index.md    |  2 +-
 .../global_objects/rangeerror/index.md        |  2 +-
 .../global_objects/referenceerror/index.md    |  2 +-
 .../global_objects/syntaxerror/index.md       |  2 +-
 .../global_objects/typeerror/index.md         |  2 +-
 .../global_objects/urierror/index.md          |  2 +-
 17 files changed, 111 insertions(+), 48 deletions(-)
 create mode 100644 files/zh-cn/web/api/workerglobalscope/structuredclone/index.md

diff --git a/files/zh-cn/glossary/deep_copy/index.md b/files/zh-cn/glossary/deep_copy/index.md
index 21da178a919784..2e891413e2c194 100644
--- a/files/zh-cn/glossary/deep_copy/index.md
+++ b/files/zh-cn/glossary/deep_copy/index.md
@@ -40,7 +40,7 @@ let ingredients_list_deepcopy = JSON.parse(JSON.stringify(ingredients_list));
 由于深拷贝与其源对象不共享引用，因此对深拷贝所做的任何更改都不会影响源对象。
 
 ```js
-// 改变 ingredients_list_deepcopy 中 'list' 属性的值。
+// 改变 ingredients_list_deepcopy 中“list”属性的值。
 ingredients_list_deepcopy[1].list = ["rice flour", "water"];
 // ingredients_list 的“list”属性不会发生变化。
 console.log(ingredients_list[1].list);
@@ -49,9 +49,11 @@ console.log(ingredients_list[1].list);
 
 然而，虽然上面代码中的对象足够简单，可以[序列化](/zh-CN/docs/Glossary/Serialization)，但许多 JavaScript 对象根本不能序列化——例如，[函数](/zh-CN/docs/Web/JavaScript/Guide/Functions)（带有闭包）、[Symbol](/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Symbol)、在 [HTML DOM API](/zh-CN/docs/Web/API/HTML_DOM_API) 中表示 HTML 元素的对象、递归数据以及许多其他对象。在这种情况下，调用 `JSON.stringify()` 来序列化对象将会失败。所以没有办法对这些对象进行深拷贝。
 
-你也可以使用 Web API [`structuredClone()`](/zh-CN/docs/Web/API/structuredClone) 来创建深拷贝。`structuredClone()` 的优点是允许源代码中的[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)被*转移*到新的副本，而不仅仅是克隆。它还能处理更多的数据类型，如 `Error`。但是请注意，`structuredClone()` 不是 JavaScript 语言本身的特性——相反，它是浏览器和任何其他实现了 [`window`](/zh-CN/docs/Web/API/Window) 这样全局对象的 JavaScript 运行时的一个特性。调用 `structuredClone()` 来克隆一个不可序列化的对象，与调用 `JSON.stringify()` 来序列化一个不可序列化的对象一样，会失败。
+你也可以使用 Web API {{DOMxRef("Window.structuredClone", "structuredClone()")}} 来创建深拷贝。`structuredClone()` 的优点是允许源代码中的[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)被*转移*到新的副本，而不仅仅是克隆。它还能处理更多的数据类型，如 `Error`。但是请注意，`structuredClone()` 不是 JavaScript 语言本身的特性——相反，它是浏览器和任何其他实现了 [`window`](/zh-CN/docs/Web/API/Window) 这样全局对象的 JavaScript 运行时的一个特性。调用 `structuredClone()` 来克隆一个不可序列化的对象，与调用 `JSON.stringify()` 来序列化一个不可序列化的对象一样，会失败。
 
 ## 参见
 
-- {{glossary("Shallow copy", "浅拷贝")}}
-- [`window.structuredClone()`](/zh-CN/docs/Web/API/structuredClone)
+- 相关术语：
+  - {{glossary("Shallow copy", "浅拷贝")}}
+  - {{DOMxRef("Window.structuredClone()")}}
+  - {{DOMxRef("WorkerGlobalScope.structuredClone()")}}
diff --git a/files/zh-cn/glossary/serializable_object/index.md b/files/zh-cn/glossary/serializable_object/index.md
index 31e41240ca9996..e7cc6872db9a63 100644
--- a/files/zh-cn/glossary/serializable_object/index.md
+++ b/files/zh-cn/glossary/serializable_object/index.md
@@ -5,7 +5,7 @@ slug: Glossary/Serializable_object
 
 {{GlossarySidebar}}
 
-**可序列化对象**（Serializable object）是可以在任何 JavaScript 环境（领域，realm）中序列化、反序列化的对象。例如，这允许将此类对象存储在磁盘上并在以后进行恢复，或使用 {{domxref("structuredClone()")}} 对它们进行拷贝，又或者使用 {{domxref("DedicatedWorkerGlobalScope.postMessage()")}} 在 Worker 之间共享它们。
+**可序列化对象**（Serializable object）是可以在任何 JavaScript 环境（领域，realm）中序列化、反序列化的对象。例如，这允许将此类对象存储在磁盘上并在以后进行恢复，或使用 {{DOMxRef("Window.structuredClone", "structuredClone()")}} 对它们进行拷贝，又或者使用 {{domxref("DedicatedWorkerGlobalScope.postMessage()")}} 在 Worker 之间共享它们。
 
 序列化可能不包括原始对象的所有属性和其他方面的内容。例如，对 {{domxref("DOMException")}} 的序列化必须包含 `name` 和 `message` 属性，但是否包含其他属性则取决于具体实现。因此，反序列化的对象并不一定是与原始对象相同的拷贝。但是，反序列化得到的新的对象将会是一个{{glossary("deep copy", "深拷贝")}}，因此任何从原始对象序列化并反序列化到新的对象的属性都不会和原始对象共享任何引用。
 
diff --git a/files/zh-cn/web/api/domexception/index.md b/files/zh-cn/web/api/domexception/index.md
index 26c7c22f4a0018..fbc44644776445 100644
--- a/files/zh-cn/web/api/domexception/index.md
+++ b/files/zh-cn/web/api/domexception/index.md
@@ -9,7 +9,7 @@ slug: Web/API/DOMException
 
 每个异常都有一个**名称**（name），一个采用驼峰命名法的简短字符串，用于描述识别错误或异常情况。
 
-`DOMException` 是一个{{Glossary("Serializable object","可序列化对象")}}，因此可以使用 {{domxref("structuredClone()")}} 克隆，或使用 {{domxref("Worker.postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间复制。
+`DOMException` 是一个{{Glossary("Serializable object","可序列化对象")}}，因此可以使用 {{DOMxRef("Window.structuredClone", "structuredClone()")}} 克隆，或使用 {{domxref("Worker.postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间复制。
 
 ## 构造函数
 
diff --git a/files/zh-cn/web/api/web_workers_api/functions_and_classes_available_to_workers/index.md b/files/zh-cn/web/api/web_workers_api/functions_and_classes_available_to_workers/index.md
index 61f8540a831182..72c1641884a944 100644
--- a/files/zh-cn/web/api/web_workers_api/functions_and_classes_available_to_workers/index.md
+++ b/files/zh-cn/web/api/web_workers_api/functions_and_classes_available_to_workers/index.md
@@ -28,7 +28,7 @@ slug: Web/API/Web_Workers_API/Functions_and_classes_available_to_workers
 - {{domxref("reportError()")}}
 - {{domxref("setInterval()")}}
 - {{domxref("setTimeout()")}}
-- {{domxref("structuredClone()")}}
+- {{DOMxRef("WorkerGlobalScope.structuredClone", "structuredClone()")}}
 - {{domxref("DedicatedWorkerGlobalScope.requestAnimationFrame()", "requestAnimationFrame()")}}（仅专用 worker）
 - {{domxref("DedicatedWorkerGlobalScope.cancelAnimationFrame()", "cancelAnimationFrame()")}}（仅专用 worker）
 
diff --git a/files/zh-cn/web/api/web_workers_api/index.md b/files/zh-cn/web/api/web_workers_api/index.md
index e5295d1f14fd64..803ec4411eb2e4 100644
--- a/files/zh-cn/web/api/web_workers_api/index.md
+++ b/files/zh-cn/web/api/web_workers_api/index.md
@@ -49,7 +49,7 @@ worker 在一个与当前 {{DOMxRef("window")}} 不同的全局上下文中运
 - {{domxref("reportError()")}}
 - {{domxref("setInterval()")}}
 - {{domxref("setTimeout()")}}
-- {{domxref("structuredClone()")}}
+- {{DOMxRef("WorkerGlobalScope.structuredClone", "structuredClone()")}}
 - {{domxref("DedicatedWorkerGlobalScope.requestAnimationFrame()", "requestAnimationFrame()")}}（仅专用 worker）
 - {{domxref("DedicatedWorkerGlobalScope.cancelAnimationFrame()", "cancelAnimationFrame()")}}（仅专用 worker）
 
diff --git a/files/zh-cn/web/api/web_workers_api/structured_clone_algorithm/index.md b/files/zh-cn/web/api/web_workers_api/structured_clone_algorithm/index.md
index bab601b9a265da..17b2776346d5d7 100644
--- a/files/zh-cn/web/api/web_workers_api/structured_clone_algorithm/index.md
+++ b/files/zh-cn/web/api/web_workers_api/structured_clone_algorithm/index.md
@@ -47,7 +47,8 @@ slug: Web/API/Web_Workers_API/Structured_clone_algorithm
 
 - [HTML 规范：安全地传递结构化数据](https://html.spec.whatwg.org/multipage/infrastructure.html#safe-passing-of-structured-data)
 - [可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)
-- {{domxref("structuredClone()")}}
+- {{DOMxRef("Window.structuredClone()")}}
+- {{DOMxRef("WorkerGlobalScope.structuredClone()")}}
 - {{domxref("window.history")}}
 - {{domxref("window.postMessage()")}}
 - [Web Worker](/zh-CN/docs/Web/API/Web_Workers_API)
diff --git a/files/zh-cn/web/api/web_workers_api/transferable_objects/index.md b/files/zh-cn/web/api/web_workers_api/transferable_objects/index.md
index 52670208943a2d..6579489cb3a480 100644
--- a/files/zh-cn/web/api/web_workers_api/transferable_objects/index.md
+++ b/files/zh-cn/web/api/web_workers_api/transferable_objects/index.md
@@ -9,7 +9,7 @@ slug: Web/API/Web_Workers_API/Transferable_objects
 
 *可转移对象*通常用于共享资源，该资源一次仅能安全地暴露在一个 JavaScript 线程中。例如，{{jsxref("ArrayBuffer")}} 是一个拥有内存块的可转移对象。当此类缓冲区（buffer）在线程之间传输时，相关联的内存资源将从原始的缓冲区分离出来，并且附加到新线程创建的缓冲区对象中。原始线程中的缓冲区对象不再可用，因为它不再拥有属于自己的内存资源了。
 
-使用 {{domxref("structuredClone()")}} 创建对象的深层拷贝时，也可以使用转移。克隆操作后，传输的资源将被移动到克隆的对象，而不是复制。
+使用 {{DOMxRef("WorkerGlobalScope.structuredClone", "structuredClone()")}} 创建对象的深层拷贝时，也可以使用转移。克隆操作后，传输的资源将被移动到克隆的对象，而不是复制。
 
 使用转移对象资源的机制取决于对象自身。例如，当 {{jsxref("ArrayBuffer")}} 在线程之间转移时，它指向的内存资源*实际上*以快速且高效的零拷贝操作在上下文之间移动。其他对象可以通过拷贝关联的资源，然后将它从旧的上下文中删除来转移它。
 
@@ -34,7 +34,7 @@ console.log(uInt8Array.byteLength); // 0
 
 ### 在进行克隆操作时转移
 
-以下代码展示了 {{domxref("structuredClone()")}} 操作，将底层缓冲区从原始对象复制到克隆对象（`clone`）。
+以下代码展示了 `structuredClone()` 操作，将底层缓冲区从原始对象复制到克隆对象（`clone`）。
 
 ```js
 const original = new Uint8Array(1024);
diff --git a/files/zh-cn/web/api/window/structuredclone/index.md b/files/zh-cn/web/api/window/structuredclone/index.md
index 4fead1870b1873..374222c1007204 100644
--- a/files/zh-cn/web/api/window/structuredclone/index.md
+++ b/files/zh-cn/web/api/window/structuredclone/index.md
@@ -1,12 +1,13 @@
 ---
-title: structuredClone()
+title: Window：structuredClone() 方法
 slug: Web/API/Window/structuredClone
-original_slug: Web/API/structuredClone
+l10n:
+  sourceCommit: 8b6cec0ceff01e7a9d6865cf5306788e15cce4b8
 ---
 
-{{APIRef("HTML DOM")}}{{AvailableInWorkers}}
+{{APIRef("HTML DOM")}}
 
-全局的 **`structuredClone()`** 方法使用[结构化克隆算法](/zh-CN/docs/Web/API/Web_Workers_API/Structured_clone_algorithm)将给定的值进行[深拷贝](/zh-CN/docs/Glossary/Deep_copy)。
+{{domxref("Window")}} 接口的 **`structuredClone()`** 方法使用[结构化克隆算法](/zh-CN/docs/Web/API/Web_Workers_API/Structured_clone_algorithm)将给定的值进行{{Glossary("deep copy", "深拷贝")}}。
 
 该方法还支持把原值中的[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)_转移_（而不是拷贝）到新对象上。可转移对象与原始对象分离并附加到新对象；它们将无法在原始对象中被访问。
 
@@ -14,59 +15,58 @@ original_slug: Web/API/structuredClone
 
 ```js-nolint
 structuredClone(value)
-structuredClone(value, { transfer })
+structuredClone(value, options)
 ```
 
 ### 参数
 
 - `value`
   - : 被克隆的对象。可以是任何[结构化克隆支持的类型](/zh-CN/docs/Web/API/Web_Workers_API/Structured_clone_algorithm#支持的类型)。
-- `transfer` {{optional_inline}}
-  - : 是一个[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)的数组，里面的 `值` 并没有被克隆，而是被转移到被拷贝对象上。
+- `options` {{optional_inline}}
+
+  - : 一个具有以下属性的对象：
+
+    - `transfer`
+      - : 一个[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)的数组，里面的对象将被移动而不是克隆到返回的对象上。
 
 ### 返回值
 
-返回值是原始`值`的[深拷贝](/zh-CN/docs/Glossary/Deep_copy)。
+原始值（`value`）的[深拷贝](/zh-CN/docs/Glossary/Deep_copy)。
 
 ### 异常
 
 - `DataCloneError` {{domxref("DOMException")}}
   - : 如果输入值的任一部分不可序列化，则抛出该异常。
 
-## 附注
+## 描述
 
-这个函数可以用来进行[深拷贝](/zh-CN/docs/Glossary/Deep_copy) JavaScript 变量。
-也支持循环引用，如下所示：
+这个函数可以用来进行[深拷贝](/zh-CN/docs/Glossary/Deep_copy) JavaScript 变量。也支持循环引用，如下所示：
 
 ```js
-// Create an object with a value and a circular reference to itself.
+// 创建一个具有值和对自身的循环引用的对象。
 const original = { name: "MDN" };
 original.itself = original;
 
-// Clone it
+// 对它进行克隆
 const clone = structuredClone(original);
 
-console.assert(clone !== original); // the objects are not the same (not same identity)
-console.assert(clone.name === "MDN"); // they do have the same values
-console.assert(clone.itself === clone); // and the circular reference is preserved
+console.assert(clone !== original); // 对象并不相同（标识不同）
+console.assert(clone.name === "MDN"); // 它们具有相同的值
+console.assert(clone.itself === clone); // 且保留了循环引用
 ```
 
-### Transferring values
+### 转移值
 
-使用可选参数 `transfer` 里的值，可以使[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)（仅）被传递，不被克隆。
-传输导致原始对象（里的属性）无法继续使用。
+使用参数 `options` 的里 `transfer` 属性，可以使[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)（仅）被传递，不被克隆。转移会导致原始对象无法继续使用。
 
 > [!NOTE]
-> 一个可能有用的场景是在保存 buffer 之前先异步的校验里面的数据。为了避免 buffer 在保存之前有其他修改，你可以先克隆这个 buffer 然后校验数据。为了防止意外的错误引用，在传输数据时，任何修改 buffer 的尝试都会失败。
+> 一个可能有用的场景是在保存缓冲区之前先异步的校验里面的数据。为了避免缓冲区在保存之前有其他修改，你可以先克隆这个缓冲区然后校验数据。为了防止意外的错误引用，在传输数据时，任何修改缓冲区的尝试都会失败。
 
-以下演示了如何把一个数组的属性转义到新对象。
-返回结果时，原始对象里的 `uInt8Array.buffer` 会被清除掉。
+以下演示了如何把一个数组的属性转移到新对象。返回结果时，原始对象里的 `uInt8Array.buffer` 会被清除掉。
 
 ```js
-var uInt8Array = new Uint8Array(1024 * 1024 * 16); // 16MB
-for (var i = 0; i < uInt8Array.length; ++i) {
-  uInt8Array[i] = i;
-}
+// 16MB = 1024 * 1024 * 16
+const uInt8Array = Uint8Array.from({ length: 1024 * 1024 * 16 }, (v, i) => i);
 
 const transferred = structuredClone(uInt8Array, {
   transfer: [uInt8Array.buffer],
@@ -74,8 +74,7 @@ const transferred = structuredClone(uInt8Array, {
 console.log(uInt8Array.byteLength); // 0
 ```
 
-你可以克隆任意数量的对象，并传输对象的任意子集。
-例如 以下代码会把 `arrayBuffer1` 作为值传输 但不是 `arrayBuffer2`。
+你可以克隆任意数量的对象，并转移对象的任意子集。例如，以下代码会把 `arrayBuffer1` 作为值转移（而不是 `arrayBuffer2`）。
 
 ```js
 const transferred = structuredClone(
@@ -106,7 +105,7 @@ console.log(mushrooms1.amanita); // ["muscaria"]
 
 ### 转移一个对象
 
-在本示例中我们创建了一个 {{jsxref("ArrayBuffer")}} 然后克隆将它作为属性的对象，将它转移。我们可以使用克隆对象里的 buffer，但是如果我们尝试使用原对象的 buffer 的话就会产生异常。
+在本示例中我们创建了一个 {{jsxref("ArrayBuffer")}} 然后克隆将它作为属性的对象，将它转移。我们可以使用克隆对象里的缓冲区（buffer），但是如果我们尝试使用原对象的缓冲区的话就会产生异常。
 
 ```js
 // 创建一个给定字节大小的 ArrayBuffer
diff --git a/files/zh-cn/web/api/workerglobalscope/structuredclone/index.md b/files/zh-cn/web/api/workerglobalscope/structuredclone/index.md
new file mode 100644
index 00000000000000..67259ae234ade5
--- /dev/null
+++ b/files/zh-cn/web/api/workerglobalscope/structuredclone/index.md
@@ -0,0 +1,61 @@
+---
+title: WorkerGlobalScope：structuredClone() 方法
+slug: Web/API/WorkerGlobalScope/structuredClone
+l10n:
+  sourceCommit: 8b6cec0ceff01e7a9d6865cf5306788e15cce4b8
+---
+
+{{APIRef("Web Workers API")}}{{AvailableInWorkers("worker")}}
+
+{{domxref("WorkerGlobalScope")}} 接口的 **`structuredClone()`** 方法使用[结构化克隆算法](/zh-CN/docs/Web/API/Web_Workers_API/Structured_clone_algorithm)将给定的值进行{{Glossary("deep copy", "深拷贝")}}。
+
+该方法还支持把原值中的[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)_转移_（而不是拷贝）到新对象上。可转移对象与原始对象分离并附加到新对象；它们将无法在原始对象中被访问。
+
+## 语法
+
+```js-nolint
+structuredClone(value)
+structuredClone(value, options)
+```
+
+### 参数
+
+- `value`
+  - : 被克隆的对象。可以是任何[结构化克隆支持的类型](/zh-CN/docs/Web/API/Web_Workers_API/Structured_clone_algorithm#支持的类型)。
+- `options` {{optional_inline}}
+
+  - : 一个具有以下属性的对象：
+
+    - `transfer`
+      - : 一个[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)的数组，里面的对象将被移动而不是克隆到返回的对象上。
+
+### 返回值
+
+原始值（`value`）的[深拷贝](/zh-CN/docs/Glossary/Deep_copy)。
+
+### 异常
+
+- `DataCloneError` {{domxref("DOMException")}}
+  - : 如果输入值的任一部分不可序列化，则抛出该异常。
+
+## 描述
+
+参见 {{domxref("Window.structuredClone()")}} 以获取该函数的详细信息。
+
+## 示例
+
+参见 {{domxref("Window.structuredClone()")}} 以获取示例。
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- [`core-js`](https://github.com/zloirock/core-js) 已经支持 [`structuredClone` 的 polyfill](https://github.com/zloirock/core-js#structuredclone)
+- [结构化克隆算法](/zh-CN/docs/Web/API/Web_Workers_API/Structured_clone_algorithm)
+- [结构化克隆的 polyfill](https://github.com/ungap/structured-clone)
diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/index.md b/files/zh-cn/web/javascript/reference/global_objects/array/index.md
index 3cc64c92708fe8..42659eb63d6198 100644
--- a/files/zh-cn/web/javascript/reference/global_objects/array/index.md
+++ b/files/zh-cn/web/javascript/reference/global_objects/array/index.md
@@ -677,7 +677,7 @@ const fruitsCopy3 = fruits.slice();
 const fruitsDeepCopy = JSON.parse(JSON.stringify(fruits));
 ```
 
-你还可以使用 [`structuredClone()`](/zh-CN/docs/Web/API/structuredClone) 方法创建深拷贝，该方法的优点是允许源代码中的[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)被*转移*到新的副本，而不仅仅是克隆。
+你还可以使用 {{DOMxRef("Window.structuredClone", "structuredClone()")}} 方法创建深拷贝，该方法的优点是允许源代码中的[可转移对象](/zh-CN/docs/Web/API/Web_Workers_API/Transferable_objects)被*转移*到新的副本，而不仅仅是克隆。
 
 最后，重要的是要理解，将现有数组赋值给新变量并不会创建数组或其元素的副本。相反，新变量只是对原数组的引用或别名；也就是说，原来的数组名和新的变量名只是同一个对象的两个名称（因此总是被计算为[严格相等](/zh-CN/docs/Web/JavaScript/Equality_comparisons_and_sameness#严格相等)）。因此，如果你对原数组的值或新变量的值做了任何改变，另一个也会改变：
 
diff --git a/files/zh-cn/web/javascript/reference/global_objects/evalerror/index.md b/files/zh-cn/web/javascript/reference/global_objects/evalerror/index.md
index 441bcf1018e41c..bcb597615d3c13 100644
--- a/files/zh-cn/web/javascript/reference/global_objects/evalerror/index.md
+++ b/files/zh-cn/web/javascript/reference/global_objects/evalerror/index.md
@@ -7,7 +7,7 @@ slug: Web/JavaScript/Reference/Global_Objects/EvalError
 
 本对象代表了一个关于 {{jsxref("Global_Objects/eval", "eval()")}} 全局函数的错误。此异常不再会被 JavaScript 抛出，但是 EvalError 对象仍然存在，以保持兼容性。
 
-`EvalError` 是一个{{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{domxref("structuredClone()")}} 对它进行克隆，也可以使用 {{domxref("Worker/postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间拷贝它。
+`EvalError` 是一个{{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{DOMxRef("Window.structuredClone", "structuredClone()")}} 对它进行克隆，也可以使用 {{domxref("Worker/postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间拷贝它。
 
 ## 构造函数
 
diff --git a/files/zh-cn/web/javascript/reference/global_objects/json/stringify/index.md b/files/zh-cn/web/javascript/reference/global_objects/json/stringify/index.md
index 8fdbeba121d412..c59e3fffc11eaf 100644
--- a/files/zh-cn/web/javascript/reference/global_objects/json/stringify/index.md
+++ b/files/zh-cn/web/javascript/reference/global_objects/json/stringify/index.md
@@ -183,7 +183,7 @@ JSON.stringify(circularReference);
 
 要序列化循环引用，你可以使用支持循环引用的库（例如 Douglas Crockford 的 [cycle.js](https://github.com/douglascrockford/JSON-js/blob/master/cycle.js)），或者自己实现一个解决方案，这需要找到循环引用，并用可序列化的值替换（或移除）它们。
 
-如果你在使用 `JSON.stringify()` 来深拷贝一个对象，你可能想要使用 [`structuredClone()`](/zh-CN/docs/Web/API/structuredClone)，它支持循环引用。JavaScript 引擎的二进制序列化 API，比如 [`v8.serialize()`](https://nodejs.org/api/v8.html#v8serializevalue)，也支持循环引用。
+如果你在使用 `JSON.stringify()` 来深拷贝一个对象，你可能想要使用 {{DOMxRef("Window.structuredClone", "structuredClone()")}}，它支持循环引用。JavaScript 引擎的二进制序列化 API，比如 [`v8.serialize()`](https://nodejs.org/api/v8.html#v8serializevalue)，也支持循环引用。
 
 ### `JSON.stringify`用作 JavaScript
 
diff --git a/files/zh-cn/web/javascript/reference/global_objects/rangeerror/index.md b/files/zh-cn/web/javascript/reference/global_objects/rangeerror/index.md
index 109b2de164969a..ee9dcf684e9f70 100644
--- a/files/zh-cn/web/javascript/reference/global_objects/rangeerror/index.md
+++ b/files/zh-cn/web/javascript/reference/global_objects/rangeerror/index.md
@@ -17,7 +17,7 @@ slug: Web/JavaScript/Reference/Global_Objects/RangeError
 - 尝试使用 {{jsxref("Array")}} 构造函数创建一个具有不合法的长度的字符串，或
 - 传递错误值到数值计算方法（{{jsxref("Number.toExponential()")}}、{{jsxref("Number.toFixed()")}} 或 {{jsxref("Number.toPrecision()")}}）。
 
-`RangeError` 是一个{{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{domxref("structuredClone()")}} 对它进行克隆，也可以使用 {{domxref("Worker/postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间拷贝它。
+`RangeError` 是一个{{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{DOMxRef("Window.structuredClone", "structuredClone()")}} 对它进行克隆，也可以使用 {{domxref("Worker/postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间拷贝它。
 
 ## 构造函数
 
diff --git a/files/zh-cn/web/javascript/reference/global_objects/referenceerror/index.md b/files/zh-cn/web/javascript/reference/global_objects/referenceerror/index.md
index e12d66a7631d17..844212f054d77d 100644
--- a/files/zh-cn/web/javascript/reference/global_objects/referenceerror/index.md
+++ b/files/zh-cn/web/javascript/reference/global_objects/referenceerror/index.md
@@ -7,7 +7,7 @@ slug: Web/JavaScript/Reference/Global_Objects/ReferenceError
 
 **`ReferenceError`**（引用错误）对象代表当一个不存在（或尚未初始化）的变量被引用时发生的错误。
 
-`ReferenceError` 是一个{{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{domxref("structuredClone()")}} 对它进行克隆，也可以使用 {{domxref("Worker/postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间拷贝它。
+`ReferenceError` 是一个{{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{DOMxRef("Window.structuredClone", "structuredClone()")}} 对它进行克隆，也可以使用 {{domxref("Worker/postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间拷贝它。
 
 ## 构造函数
 
diff --git a/files/zh-cn/web/javascript/reference/global_objects/syntaxerror/index.md b/files/zh-cn/web/javascript/reference/global_objects/syntaxerror/index.md
index 04cc06001dc53a..8099336e754d09 100644
--- a/files/zh-cn/web/javascript/reference/global_objects/syntaxerror/index.md
+++ b/files/zh-cn/web/javascript/reference/global_objects/syntaxerror/index.md
@@ -7,7 +7,7 @@ slug: Web/JavaScript/Reference/Global_Objects/SyntaxError
 
 **`SyntaxError`**（语法错误）对象代表尝试解析不符合语法的代码的错误。当 Javascript 引擎解析代码时，遇到了不符合语法规范的标记（token）或标记顺序，则会抛出 `SyntaxError`。
 
-`SyntaxError` 是一个{{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{domxref("structuredClone()")}} 对它进行克隆，也可以使用 {{domxref("Worker/postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间拷贝它。
+`SyntaxError` 是一个{{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{DOMxRef("Window.structuredClone", "structuredClone()")}} 对它进行克隆，也可以使用 {{domxref("Worker/postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间拷贝它。
 
 ## 构造函数
 
diff --git a/files/zh-cn/web/javascript/reference/global_objects/typeerror/index.md b/files/zh-cn/web/javascript/reference/global_objects/typeerror/index.md
index 6736360da9fbc5..ba4238e6bef19b 100644
--- a/files/zh-cn/web/javascript/reference/global_objects/typeerror/index.md
+++ b/files/zh-cn/web/javascript/reference/global_objects/typeerror/index.md
@@ -13,7 +13,7 @@ slug: Web/JavaScript/Reference/Global_Objects/TypeError
 - 尝试修改无法更改的值；或
 - 尝试以不适当的方法使用一个值。
 
-`TypeError` 是一个{{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{domxref("structuredClone()")}} 对它进行克隆，也可以使用 {{domxref("Worker/postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间拷贝它。
+`TypeError` 是一个{{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{DOMxRef("Window.structuredClone", "structuredClone()")}} 对它进行克隆，也可以使用 {{domxref("Worker/postMessage()", "postMessage()")}} 在 [Worker](/zh-CN/docs/Web/API/Worker) 之间拷贝它。
 
 ## 构造函数
 
diff --git a/files/zh-cn/web/javascript/reference/global_objects/urierror/index.md b/files/zh-cn/web/javascript/reference/global_objects/urierror/index.md
index 2c4d45d7b4c028..843e5bf4c6643c 100644
--- a/files/zh-cn/web/javascript/reference/global_objects/urierror/index.md
+++ b/files/zh-cn/web/javascript/reference/global_objects/urierror/index.md
@@ -7,7 +7,7 @@ slug: Web/JavaScript/Reference/Global_Objects/URIError
 
 **`URIError`** 对象用来表示以一种错误的方式使用全局 URI 处理函数而产生的错误。
 
-`URIError` 是 {{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{domxref("structuredClone()")}} 克隆它，或者在 [Worker](/zh-CN/docs/Web/API/Worker) 间使用 {{domxref("Worker/postMessage()", "postMessage()")}} 拷贝这个对象。
+`URIError` 是 {{Glossary("serializable object", "可序列化对象")}}，所以可以使用 {{DOMxRef("Window.structuredClone", "structuredClone()")}} 克隆它，或者在 [Worker](/zh-CN/docs/Web/API/Worker) 间使用 {{domxref("Worker/postMessage()", "postMessage()")}} 拷贝这个对象。
 
 ## 构造函数
 

From 59b6d0944e0532a4f1017b588f72e7fed1689f0b Mon Sep 17 00:00:00 2001
From: pro_shunsuke <shunsuke0901@gmail.com>
Date: Fri, 27 Sep 2024 18:56:05 +0900
Subject: [PATCH 07/43] Update index.md
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ありますます → あります
---
 files/ja/web/api/customevent/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/ja/web/api/customevent/index.md b/files/ja/web/api/customevent/index.md
index 06221b53fc642b..7325c534796d76 100644
--- a/files/ja/web/api/customevent/index.md
+++ b/files/ja/web/api/customevent/index.md
@@ -20,7 +20,7 @@ l10n:
 
 ## インスタンスプロパティ
 
-_親である {{domxref("Event")}} インターフェイスから継承したプロパティがありますます。_
+_親である {{domxref("Event")}} インターフェイスから継承したプロパティがあります。_
 
 - {{domxref("CustomEvent.detail")}} {{ReadOnlyInline}}
   - : イベントが初期化されたときに渡された何らかのデータを返します。

From fd699a00f8aeac4f6ea416194603bc1f4c81b189 Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Sat, 28 Sep 2024 14:36:05 +0800
Subject: [PATCH 08/43] [zh-CN]: add translation for
 `Document.{pointerlockchange, pointerlockerror}` (#23790)

---
 .../document/pointerlockchange_event/index.md | 81 ++++++++++---------
 .../document/pointerlockerror_event/index.md  | 58 +++++++++++++
 2 files changed, 101 insertions(+), 38 deletions(-)
 create mode 100644 files/zh-cn/web/api/document/pointerlockerror_event/index.md

diff --git a/files/zh-cn/web/api/document/pointerlockchange_event/index.md b/files/zh-cn/web/api/document/pointerlockchange_event/index.md
index a2d30711e029ba..fc805117287beb 100644
--- a/files/zh-cn/web/api/document/pointerlockchange_event/index.md
+++ b/files/zh-cn/web/api/document/pointerlockchange_event/index.md
@@ -1,54 +1,59 @@
 ---
-title: "Document: pointerlockchange event"
+title: Document：pointerlockchange 事件
 slug: Web/API/Document/pointerlockchange_event
+l10n:
+  sourceCommit: c99ff93a1b71e7d664509fdd3e0c168920be967a
 ---
 
-{{APIRef}}
-
-`pointerlockchange` 事件当指针解锁或者被锁定时触发
-
-<table class="properties">
-  <tbody>
-    <tr>
-      <th scope="row">冒泡</th>
-      <td>Yes</td>
-    </tr>
-    <tr>
-      <th scope="row">可取消</th>
-      <td>No</td>
-    </tr>
-    <tr>
-      <th scope="row">接口</th>
-      <td>{{domxref("Event")}}</td>
-    </tr>
-    <tr>
-      <th scope="row">Event handler property</th>
-      <td>
-        {{domxref("Document/onpointerlockchange", "onpointerlockchange")}}
-      </td>
-    </tr>
-  </tbody>
-</table>
-
-## 例子
-
-使用 `addEventListener()`:
+{{APIRef("Pointer Lock API")}}
+
+**`pointerlockchange`** 事件在指针被锁定/解锁时触发。
+
+事件处理器可以使用 {{domxref("Document.pointerLockElement")}} 来确定指针是否被锁定，如果是，则确定哪个元素被锁定。
+
+此事件不可取消，也不会冒泡。
+
+## 语法
+
+在诸如 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 之类的方法中使用事件名称，或设置事件处理器属性。
+
+```js
+addEventListener("pointerlockchange", (event) => {});
+
+onpointerlockchange = (event) => {};
+```
+
+## 事件类型
+
+通用的 {{domxref("Event")}}。
+
+## 示例
+
+使用 `addEventListener()`：
 
 ```js
-document.addEventListener("pointerlockchange", (event) => {
-  console.log("Pointer lock changed");
+addEventListener("pointerlockchange", (event) => {
+  if (document.pointerLockElement)
+    console.log("指针被锁定到：", document.pointerLockElement);
+  else {
+    console.log("指针未锁定");
+  }
 });
 ```
 
-使用 `onpointerlockchange` 事件处理程序属性
+使用 `onpointerlockchange` 事件处理器属性：
 
 ```js
 document.onpointerlockchange = (event) => {
-  console.log("Pointer lock changed");
+  if (document.pointerLockElement)
+    console.log("指针被锁定到：", document.pointerLockElement);
+  else {
+    console.log("指针未锁定");
+  }
 };
 ```
 
-## Specifications
+## 规范
 
 {{Specifications}}
 
@@ -56,6 +61,6 @@ document.onpointerlockchange = (event) => {
 
 {{Compat}}
 
-## 参考
+## 参见
 
-- [Using Pointer Lock API](/zh-CN/docs/API/Pointer_Lock_API)
+- [使用 Pointer Lock API](/zh-CN/docs/Web/API/Pointer_Lock_API)
diff --git a/files/zh-cn/web/api/document/pointerlockerror_event/index.md b/files/zh-cn/web/api/document/pointerlockerror_event/index.md
new file mode 100644
index 00000000000000..9da0c7f7dfd6c2
--- /dev/null
+++ b/files/zh-cn/web/api/document/pointerlockerror_event/index.md
@@ -0,0 +1,58 @@
+---
+title: Document：pointerlockerror 事件
+slug: Web/API/Document/pointerlockerror_event
+l10n:
+  sourceCommit: c99ff93a1b71e7d664509fdd3e0c168920be967a
+---
+
+{{APIRef("Pointer Lock API")}}
+
+**`pointerlockerror`** 事件在锁定指针失败（由于技术原因或权限被拒绝）时触发。
+
+此事件不可取消，也不会冒泡。
+
+## 语法
+
+在诸如 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 之类的方法中使用事件名称，或设置事件处理器属性。
+
+```js
+addEventListener("pointerlockerror", (event) => {});
+
+onpointerlockerror = (event) => {};
+```
+
+## 事件类型
+
+通用 {{domxref("Event")}}。
+
+## 示例
+
+使用 `addEventListener()`：
+
+```js
+const para = document.querySelector("p");
+
+document.addEventListener("pointerlockerror", (event) => {
+  console.log("指针锁定错误");
+});
+```
+
+使用 `onpointerlockerror` 事件处理器属性：
+
+```js
+document.onpointerlockerror = (event) => {
+  console.log("指针锁定错误");
+};
+```
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- [使用 Pointer Lock API](/zh-CN/docs/Web/API/Pointer_Lock_API)

From d045a6bd4292e7b780d44993522137a3111d4bc8 Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Sat, 28 Sep 2024 14:41:00 +0800
Subject: [PATCH 09/43] [zh-CN]: add translation for `{Document,
 ShadowRoot}.pointerLockElement` (#23797)

---
 .../api/document/pointerlockelement/index.md  | 58 +++++++++++++++----
 .../shadowroot/pointerlockelement/index.md    | 36 ++++++++++++
 2 files changed, 83 insertions(+), 11 deletions(-)
 create mode 100644 files/zh-cn/web/api/shadowroot/pointerlockelement/index.md

diff --git a/files/zh-cn/web/api/document/pointerlockelement/index.md b/files/zh-cn/web/api/document/pointerlockelement/index.md
index 8a06ab9eafafc9..7777e7e4f923c9 100644
--- a/files/zh-cn/web/api/document/pointerlockelement/index.md
+++ b/files/zh-cn/web/api/document/pointerlockelement/index.md
@@ -1,30 +1,66 @@
 ---
 title: Document：pointerLockElement 属性
 slug: Web/API/Document/pointerLockElement
+l10n:
+  sourceCommit: c99ff93a1b71e7d664509fdd3e0c168920be967a
 ---
 
-{{APIRef("DOM")}}
+{{APIRef("Pointer Lock API")}}
 
-{{domxref("Document")}} 接口的 `pointerLockElement` 只读属性提供了指针锁定时鼠标事件的目标元素。如果指针处于锁定等待中、指针没有被锁定或目标元素在另外一个文档中，返回 `null`。
+{{domxref("Document")}} 接口的 **`pointerLockElement`** 只读属性提供了指针锁定时鼠标事件的目标元素。如果指针处于锁定等待中、指针没有被锁定或目标元素在另外一个文档中，返回 `null`。
 
 ## 值
 
-一个 {{domxref("Element")}} 或 `null`。
+{{domxref("Element")}} 或 `null`。
 
 ## 示例
 
-确定一个 canvas 元素当前是否被指针锁定。
+### 检查指针锁定状态
 
-```js
-if (document.pointerLockElement === canvasElement) {
-  console.log("指针当前已锁定");
-  // 做一些有用的响应
-} else {
-  console.log("指针当前已解锁");
-  // 做一些有用的响应
+此示例包含一个 {{htmlelement("div")}} 元素，该元素又包含一个 {{htmlelement("button")}}。单击按钮会请求 `<div>` 的指针锁定。
+
+此示例还监听 {{domxref("Document/pointerlockchange_event", "pointerlockchange")}} 事件：触发此事件时，如果文档中的元素具有指针锁定，则事件处理程序会禁用“锁定”按钮，否则启用该按钮。
+
+这样做的效果是，如果你单击“锁定”按钮，指针将被锁定，按钮将被禁用：如果你随后退出指针锁定（例如，按 <kbd>Escape</kbd> 键），按钮将再次启用。
+
+#### HTML
+
+```html
+<div id="container">
+  <button id="lock">锁定</button>
+</div>
+```
+
+#### CSS
+
+```css
+div {
+  height: 100px;
+  width: 200px;
+  border: 2px solid blue;
 }
 ```
 
+#### JavaScript
+
+```js
+const lock = document.querySelector("#lock");
+const container = document.querySelector("#container");
+
+lock.addEventListener("click", () => {
+  container.requestPointerLock();
+});
+
+document.addEventListener("pointerlockchange", () => {
+  const locked = document.pointerLockElement;
+  lock.disabled = Boolean(locked);
+});
+```
+
+#### 结果
+
+{{EmbedLiveSample("检查指针锁定状态")}}
+
 ## 规范
 
 {{Specifications}}
diff --git a/files/zh-cn/web/api/shadowroot/pointerlockelement/index.md b/files/zh-cn/web/api/shadowroot/pointerlockelement/index.md
new file mode 100644
index 00000000000000..fd5606eb39b61b
--- /dev/null
+++ b/files/zh-cn/web/api/shadowroot/pointerlockelement/index.md
@@ -0,0 +1,36 @@
+---
+title: ShadowRoot：pointerLockElement 属性
+slug: Web/API/ShadowRoot/pointerLockElement
+l10n:
+  sourceCommit: c99ff93a1b71e7d664509fdd3e0c168920be967a
+---
+
+{{APIRef("Pointer Lock API")}}
+
+{{domxref("ShadowRoot")}} 接口的 **`pointerLockElement`** 只读属性提供在指针锁定时作为鼠标事件目标的元素集。如果指针处于锁定等待中、指针没有被锁定或目标元素在另外一棵树中，则该属性为 `null`。
+
+## 值
+
+{{domxref("Element")}} 或 `null`。
+
+## 示例
+
+```js
+let customElem = document.querySelector("my-shadow-dom-element");
+let shadow = customElem.shadowRoot;
+let pleElem = shadow.pointerLockElement;
+```
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- {{ domxref("Document.exitPointerLock()") }}
+- {{ domxref("Element.requestPointerLock()") }}
+- [Pointer Lock](/zh-CN/docs/Web/API/Pointer_Lock_API)

From b1f8dd5b0752cca9cb4b40d573891e879a74cfa5 Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Sat, 28 Sep 2024 14:43:12 +0800
Subject: [PATCH 10/43] [zh-CN]: sync translation for `MouseEvent.{movementX,
 movementY}` (#23799)

---
 .../web/api/mouseevent/movementx/index.md     | 49 +++++++++++++++----
 .../web/api/mouseevent/movementy/index.md     | 45 +++++++++++++----
 2 files changed, 74 insertions(+), 20 deletions(-)

diff --git a/files/zh-cn/web/api/mouseevent/movementx/index.md b/files/zh-cn/web/api/mouseevent/movementx/index.md
index 0ace09670f73ce..f1bfa0575b111b 100644
--- a/files/zh-cn/web/api/mouseevent/movementx/index.md
+++ b/files/zh-cn/web/api/mouseevent/movementx/index.md
@@ -1,21 +1,49 @@
 ---
-title: MouseEvent.movementX
+title: MouseEvent：movementX 属性
 slug: Web/API/MouseEvent/movementX
+l10n:
+  sourceCommit: cfb7587e3e3122630ad6cbd94d834ecadbe0a746
 ---
 
 {{APIRef("Pointer Lock API")}}
 
-**`MouseEvent.movementX`** 是只读属性，它提供了当前事件和上一个[`mousemove`](/zh-CN/docs/Web/API/Element/mousemove_event)事件之间鼠标在水平方向上的移动值。换句话说，这个值是这样计算的 : `currentEvent.movementX = currentEvent.screenX - previousEvent.screenX`.
+{{domxref("MouseEvent")}} 接口的 **`movementX`** 只读属性提供了给定事件与前一个 {{domxref("Element/mousemove_event", "mousemove")}} 事件之间鼠标指针在 X 坐标轴上的移动值。换句话说，该属性的值计算如下：`currentEvent.movementX = currentEvent.screenX - previousEvent.screenX`。
 
-## 语法
+> [!WARNING]
+> 浏览器对 [`movementX` 和 {{domxref("MouseEvent.screenX", "screenX")}}](https://github.com/w3c/pointerlock/issues/42) 使用与规范定义不同的单位。根据浏览器和操作系统的不同，`movementX` 单位可能是物理像素、逻辑像素或 CSS 像素。你可能希望避免使用 movement 属性，而是计算当前客户端值（{{domxref("MouseEvent.screenX", "screenX")}}、{{domxref("MouseEvent.screenY", "screenY")}}）与之前的客户端值之间的差值。
 
-```plain
-var xShift = instanceOfMouseEvent.movementX
+## 值
+
+一个数字。除 `mousemove` 事件之外，在其他任何 {{domxref("MouseEvent")}} 事件上始终为零。
+
+## 示例
+
+此示例使用 `movementX` 和 {{domxref("MouseEvent.movementY", "movementY")}} 记录鼠标移动量。
+
+### HTML
+
+```html
+<p id="log">移动鼠标。</p>
+```
+
+### JavaScript
+
+```js
+function logMovement(event) {
+  log.insertAdjacentHTML(
+    "afterbegin",
+    `movement: ${event.movementX}, ${event.movementY}<br>`,
+  );
+  while (log.childNodes.length > 128) log.lastChild.remove();
+}
+
+const log = document.getElementById("log");
+document.addEventListener("mousemove", logMovement);
 ```
 
-### 返回值
+### 结果
 
-一个数字
+{{EmbedLiveSample("示例")}}
 
 ## 规范
 
@@ -25,7 +53,8 @@ var xShift = instanceOfMouseEvent.movementX
 
 {{Compat}}
 
-## 相关
+## 参见
 
-- {{ domxref("MouseEvent") }}
-- [Pointer Lock](/zh-CN/docs/WebAPI/Pointer_Lock)
+- {{domxref("MouseEvent.movementY")}}
+- {{domxref("MouseEvent")}}
+- [Pointer Lock](/zh-CN/docs/Web/API/Pointer_Lock_API)
diff --git a/files/zh-cn/web/api/mouseevent/movementy/index.md b/files/zh-cn/web/api/mouseevent/movementy/index.md
index a67d47ae53c8c7..77170233ba3151 100644
--- a/files/zh-cn/web/api/mouseevent/movementy/index.md
+++ b/files/zh-cn/web/api/mouseevent/movementy/index.md
@@ -1,21 +1,45 @@
 ---
-title: MouseEvent.movementY
+title: MouseEvent：movementY 属性
 slug: Web/API/MouseEvent/movementY
+l10n:
+  sourceCommit: cfb7587e3e3122630ad6cbd94d834ecadbe0a746
 ---
 
 {{APIRef("Pointer Lock API")}}
 
-{{domxref("MouseEvent")}} 接口的 **`MouseEvent.movementY`** 只读属性提供了当前事件和上一个 {{domxref("Element/mousemove_event", "mousemove")}} 事件之间鼠标在竖直方向上的移动值。换句话说，这个值是这样计算的：`currentEvent.movementY = currentEvent.screenY - previousEvent.screenY`。
+{{domxref("MouseEvent")}} 接口的 **`movementY`** 只读属性提供了当前事件和上一个 {{domxref("Element/mousemove_event", "mousemove")}} 事件之间鼠标指针在 Y 坐标轴上的移动值。换句话说，这个值是这样计算的：`currentEvent.movementY = currentEvent.screenY - previousEvent.screenY`。
 
-## 语法
+> [!WARNING]
+> 浏览器对 [`movementY` 和 {{domxref("MouseEvent.screenY", "screenY")}}](https://github.com/w3c/pointerlock/issues/42) 使用与规范定义不同的单位。根据浏览器和操作系统的不同，`movementY` 单位可能是物理像素、逻辑像素或 CSS 像素。你可能希望避免使用 movement 属性，而是计算当前客户端值（{{domxref("MouseEvent.screenX", "screenX")}}、{{domxref("MouseEvent.screenY", "screenY")}}）与之前的客户端值之间的差值。
 
-```plain
-var yShift = instanceOfMouseEvent.movementY
+## 值
+
+一个数字。除 `mousemove` 事件之外，在其他任何 {{domxref("MouseEvent")}} 事件上始终为零。
+
+## 示例
+
+此示例使用 {{domxref("MouseEvent.movementX", "movementX")}} 和 `movementY` 记录鼠标移动量。
+
+### HTML
+
+```html
+<p id="log">移动鼠标。</p>
+```
+
+### JavaScript
+
+```js
+function logMovement(event) {
+  log.innerText = `movement: ${event.movementX}, ${event.movementY}\n${log.innerText}`;
+}
+
+const log = document.getElementById("log");
+document.addEventListener("mousemove", logMovement);
 ```
 
-### 返回值
+### 结果
 
-A number
+{{EmbedLiveSample("示例")}}
 
 ## 规范
 
@@ -25,7 +49,8 @@ A number
 
 {{Compat}}
 
-## 相关
+## 参见
 
-- {{ domxref("MouseEvent") }}
-- [Pointer Lock](/zh-CN/docs/WebAPI/Pointer_Lock)
+- {{domxref("MouseEvent.movementX")}}
+- {{domxref("MouseEvent")}}
+- [Pointer Lock](/zh-CN/docs/Web/API/Pointer_Lock_API)

From c9fc64c2fe6e5fe6b845bed45fdc58e2048a8dcc Mon Sep 17 00:00:00 2001
From: Gahotx <53534938+Gahotx@users.noreply.github.com>
Date: Sat, 28 Sep 2024 15:02:14 +0800
Subject: [PATCH 11/43] [zh-cn]: create the translation of the SVG attribute
 `baseFrequency` (#23783)

Co-authored-by: A1lo <yin199909@aliyun.com>
---
 .../web/svg/attribute/basefrequency/index.md  | 112 ++++++++++++++++++
 1 file changed, 112 insertions(+)
 create mode 100644 files/zh-cn/web/svg/attribute/basefrequency/index.md

diff --git a/files/zh-cn/web/svg/attribute/basefrequency/index.md b/files/zh-cn/web/svg/attribute/basefrequency/index.md
new file mode 100644
index 00000000000000..81dab905aabdaf
--- /dev/null
+++ b/files/zh-cn/web/svg/attribute/basefrequency/index.md
@@ -0,0 +1,112 @@
+---
+title: baseFrequency
+slug: Web/SVG/Attribute/baseFrequency
+l10n:
+  sourceCommit: 829db137a01feb14af7beaec178a3ea0118b4777
+---
+
+{{SVGRef}}
+
+**`baseFrequency`** 属性表示 {{SVGElement("feTurbulence")}} 滤镜原语的噪点函数的基础频率参数。
+
+你可以将此属性与以下 SVG 元素一起使用：
+
+- {{SVGElement("feTurbulence")}}
+
+## 示例
+
+### 示例 1
+
+```css hidden
+html,
+body,
+svg {
+  height: 100%;
+}
+```
+
+```html
+<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg">
+  <filter id="noise1" x="0" y="0" width="100%" height="100%">
+    <feTurbulence baseFrequency="0.025" />
+  </filter>
+  <filter id="noise2" x="0" y="0" width="100%" height="100%">
+    <feTurbulence baseFrequency="0.05" />
+  </filter>
+
+  <rect x="0" y="0" width="200" height="200" style="filter: url(#noise1);" />
+  <rect
+    x="0"
+    y="0"
+    width="200"
+    height="200"
+    style="filter: url(#noise2); transform: translateX(220px);" />
+</svg>
+```
+
+{{EmbedLiveSample("示例 1", "220", "220")}}
+
+### 示例 2
+
+```html
+<svg
+  width="200"
+  height="200"
+  viewBox="0 0 220 220"
+  xmlns="http://www.w3.org/2000/svg">
+  <filter id="displacementFilter">
+    <feTurbulence
+      type="turbulence"
+      baseFrequency="0.05"
+      numOctaves="2"
+      result="turbulence" />
+    <feDisplacementMap
+      in2="turbulence"
+      in="SourceGraphic"
+      scale="50"
+      xChannelSelector="R"
+      yChannelSelector="G" />
+  </filter>
+
+  <circle cx="100" cy="100" r="100" style="filter: url(#displacementFilter)" />
+</svg>
+```
+
+{{EmbedLiveSample("示例 2", "220", "250")}}
+
+## 使用说明
+
+<table class="properties">
+  <tbody>
+    <tr>
+      <th scope="row">值</th>
+      <td>
+        <a href="/zh-CN/docs/Web/SVG/Content_type#带可取舍的后缀数字的数字"
+          >&#x3C;number-optional-number></a
+        >
+      </td>
+    </tr>
+    <tr>
+      <th scope="row">默认值</th>
+      <td><code>0</code></td>
+    </tr>
+    <tr>
+      <th scope="row">动画性</th>
+      <td>有</td>
+    </tr>
+  </tbody>
+</table>
+
+- `<number-optional-number>`
+
+  - : 如果提供了两个数字，第一个数字表示水平方向的基础频率，第二个数字表示垂直方向的基础频率。如果提供了一个数字，则该值同时作用于 x 轴 和 y 轴。
+
+    禁止使用负值。
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}

From 00424a9c3f8ae0a9f97ae371d54a0b52420c8fd9 Mon Sep 17 00:00:00 2001
From: Hoarfroster <hoarfroster@outlook.com>
Date: Sat, 28 Sep 2024 16:11:01 +0800
Subject: [PATCH 12/43] zh-CN: create `extension.isAllowedIncognitoAccess()`
 (#23538)

Co-authored-by: A1lo <yin199909@aliyun.com>
---
 .../isallowedincognitoaccess/index.md         | 76 +++++++++++++++++++
 1 file changed, 76 insertions(+)
 create mode 100644 files/zh-cn/mozilla/add-ons/webextensions/api/extension/isallowedincognitoaccess/index.md

diff --git a/files/zh-cn/mozilla/add-ons/webextensions/api/extension/isallowedincognitoaccess/index.md b/files/zh-cn/mozilla/add-ons/webextensions/api/extension/isallowedincognitoaccess/index.md
new file mode 100644
index 00000000000000..b4c4c579a859a0
--- /dev/null
+++ b/files/zh-cn/mozilla/add-ons/webextensions/api/extension/isallowedincognitoaccess/index.md
@@ -0,0 +1,76 @@
+---
+title: extension.isAllowedIncognitoAccess()
+slug: Mozilla/Add-ons/WebExtensions/API/extension/isAllowedIncognitoAccess
+l10n:
+  sourceCommit: b8a0743ca8b1e1b1b1a95cc93a4413c020f11262
+---
+
+{{AddonSidebar}}
+
+检查插件是否允许访问在“隐私浏览”模式下打开的标签页。
+
+这是返回 [`Promise`](/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise) 的异步函数。
+
+## 语法
+
+```js-nolint
+let isAllowed = browser.extension.isAllowedIncognitoAccess()
+```
+
+### 参数
+
+无。
+
+### 返回值
+
+[`Promise`](/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise)，将会兑现布尔值：如果插件被允许访问隐私标签页，则为 `true`，否则为 `false`。
+
+## 示例
+
+```js
+function logIsAllowed(answer) {
+  console.log(`是否被允许：${answer}`);
+}
+
+let isAllowed = browser.extension.isAllowedIncognitoAccess();
+isAllowed.then(logIsAllowed);
+```
+
+{{WebExtExamples}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+> [!NOTE]
+> 此 API 基于 Chromium 的 [`chrome.extension`](https://developer.chrome.google.cn/docs/extensions/reference/api/extension#method-isAllowedIncognitoAccess) API。该文档衍生自 Chromium 代码中的 [`extension.json`](https://chromium.googlesource.com/chromium/src/+/master/chrome/common/extensions/api/extension.json)。
+
+<!--
+// Copyright 2015 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+-->

From e74aea41de7fd4c956ff8d64f26e737b4b002e2d Mon Sep 17 00:00:00 2001
From: Hoarfroster <hoarfroster@outlook.com>
Date: Sat, 28 Sep 2024 16:13:59 +0800
Subject: [PATCH 13/43] zh-CN: create `extension.getURL()` (#23546)

Co-authored-by: Jason Ren <40999116+jasonren0403@users.noreply.github.com>
Co-authored-by: A1lo <yin199909@aliyun.com>
---
 .../api/extension/geturl/index.md             | 80 +++++++++++++++++++
 1 file changed, 80 insertions(+)
 create mode 100644 files/zh-cn/mozilla/add-ons/webextensions/api/extension/geturl/index.md

diff --git a/files/zh-cn/mozilla/add-ons/webextensions/api/extension/geturl/index.md b/files/zh-cn/mozilla/add-ons/webextensions/api/extension/geturl/index.md
new file mode 100644
index 00000000000000..5cbd8c9e7e5dfb
--- /dev/null
+++ b/files/zh-cn/mozilla/add-ons/webextensions/api/extension/geturl/index.md
@@ -0,0 +1,80 @@
+---
+title: extension.getURL()
+slug: Mozilla/Add-ons/WebExtensions/API/extension/getURL
+l10n:
+  sourceCommit: b8a0743ca8b1e1b1b1a95cc93a4413c020f11262
+---
+
+{{AddonSidebar}}
+
+> [!WARNING]
+> 该函数已被弃用。请改用 [`runtime.getURL`](/zh-CN/docs/Mozilla/Add-ons/WebExtensions/API/runtime/getURL)。
+
+转换扩展安装目录中的相对路径为完全限定的 URL。
+
+## 语法
+
+```js-nolint
+browser.extension.getURL(
+  path // 字符串
+)
+```
+
+### 参数
+
+- `path`
+  - : `string`，扩展内相对于其安装目录的资源路径。
+
+### 返回值
+
+`string`，指向资源的完全限定 URL。
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 示例
+
+给定一个打包在附加组件中的文件，路径为“beasts/frog.html”，可以这样获取完整的 URL：
+
+```js
+let fullURL = browser.extension.getURL("beasts/frog.html");
+
+// -> 类似于这样的 URL：
+// moz-extension://2c127fa4-62c7-7e4f-90e5-472b45eecfdc/beasts/frog.html
+```
+
+{{WebExtExamples}}
+
+> [!NOTE]
+> 此 API 基于 Chromium 的 [`chrome.extension`](https://developer.chrome.google.cn/docs/extensions/reference/api/extension/#method-getURL) API。该文档衍生自 Chromium 代码中的 [`extension.json`](https://chromium.googlesource.com/chromium/src/+/master/chrome/common/extensions/api/extension.json)。
+
+<!--
+// Copyright 2015 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+-->

From 32824fa35c4eb8cf691cc195085008c4c90f1490 Mon Sep 17 00:00:00 2001
From: Leonid Vinogradov <win.leon@protonmail.com>
Date: Sat, 28 Sep 2024 16:32:11 +0200
Subject: [PATCH 14/43] [ru] update
 `Web/JavaScript/Reference/Global_Objects/Date/toUTCString` translation
 (#23762)

[ru] update 'Web/JavaScript/Reference/Global_Objects/Date/toUTCString' translation
---
 .../global_objects/date/toutcstring/index.md  | 36 ++++++++++++++++---
 1 file changed, 31 insertions(+), 5 deletions(-)

diff --git a/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.md b/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.md
index 873114ae0515e1..c7a723e994320a 100644
--- a/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.md
+++ b/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.md
@@ -1,31 +1,57 @@
 ---
 title: Date.prototype.toUTCString()
 slug: Web/JavaScript/Reference/Global_Objects/Date/toUTCString
+l10n:
+  sourceCommit: 77e46a5b43f828fcc6bd30facddc6fc4bfe84f9b
 ---
 
 {{JSRef}}
 
 ## Сводка
 
-Метод **`toUTCString()`** преобразует дату в строку, используя часовой пояс UTC.
+Метод **`toUTCString()`** экземпляров {{jsxref("Date")}} возвращает строку, представляющую дату в формате [RFC 7231](https://datatracker.ietf.org/doc/html/rfc7231#section-7.1.1.1), отрицательные значения допускаются. Временная зона всегда UTC. `toGMTString()` является синонимом этого метода.
+
+{{EmbedInteractiveExample("pages/js/date-toutcstring.html", "shorter")}}
 
 ## Синтаксис
 
-```
-dateObj.toUTCString()
+```js-nolint
+toUTCString()
 ```
 
 ### Параметры
 
 Нет.
 
+### Возвращаемое значение
+
+Строка, представляющая дату, используя временную зону UTC (смотрите описание формата). Возвращает `"Invalid Date"` если дата [недопустима](/ru/docs/Web/JavaScript/Reference/Global_Objects/Date#the_epoch_timestamps_and_invalid_date).
+
 ## Описание
 
-Значение, возвращаемое методом `toUTCString()`, является человеко-читаемой строкой в часовом поясе UTC. Формат возвращаемого значения зависит от платформы. Наиболее распространённым значением является форматированная по RFC-1123 временная метка, которая является немного обновлённой версией временной метки RFC-822.
+Значение, возвращаемое методом `toUTCString()`, является строкой в формате `Www, dd Mmm yyyy HH:mm:ss GMT`, где:
+
+| Строка | Значение                                                            |
+| ------ | ------------------------------------------------------------------- |
+| `Www`  | День недели в виде трёх букв (например, `Sun`, `Mon`)               |
+| `dd`   | День месяца в виде двух цифр, с ведущим нулём, если требуется       |
+| `Mmm`  | Месяц в виде трёх букв (например, `Jan`, `Feb`)                     |
+| `yyyy` | Год в виде четырёх или более цифр с ведущими нулями, если требуется |
+| `HH`   | Час в виде двух цифр с ведущим нулём если требуется                 |
+| `mm`   | Минута в виде двух цифр с ведущим нулём если требуется              |
+| `ss`   | Секунды в виде двух цифр с ведущим нулём, если требуется            |
+
+### Псевдонимы
+
+`Date` API в JavaScript был создан под влиянием библиотеки `java.util.Date` из языка Java (которая впоследствии стала устаревшей, начиная с версии Java 1.1 в 1997 году). В частности, у класса `Date` в Java есть метод `toGMTString`, который был неудачно назван, потому что [Среднее время по Гринвичу](https://ru.wikipedia.org/wiki/Среднее_время_по_Гринвичу) не эквивалентно [Всемирному координированному времени](https://ru.wikipedia.org/wiki/Всемирное_координированное_время), тогда как даты в JavaScript оперируют временем UTC. В целях совместимости `toGMTString` остаётся псевдонимом `toUTCString`, и они ссылаются на один и тот же объект. То есть:
+
+```js
+Date.prototype.toGMTString.name === "toUTCString";
+```
 
 ## Примеры
 
-### Пример: использование метода `toUTCString()`
+### Использование toUTCString()
 
 ```js
 const d = new Date(0);

From ae654e317185710b5f7e5f6482aea96b76558ff7 Mon Sep 17 00:00:00 2001
From: Leonid Vinogradov <win.leon@protonmail.com>
Date: Sat, 28 Sep 2024 16:44:24 +0200
Subject: [PATCH 15/43] [ru] update `Web/API/Animation/cancel` translation
 (#23365)

* [ru] update 'Web/API/Animation/cancel' translation
---
 files/ru/web/api/animation/cancel/index.md | 28 ++++++++++++----------
 1 file changed, 15 insertions(+), 13 deletions(-)

diff --git a/files/ru/web/api/animation/cancel/index.md b/files/ru/web/api/animation/cancel/index.md
index 9ee818ece042e0..546dd27227d8d7 100644
--- a/files/ru/web/api/animation/cancel/index.md
+++ b/files/ru/web/api/animation/cancel/index.md
@@ -1,32 +1,34 @@
 ---
-title: Animation.cancel()
+title: "Animation: метод cancel()"
 slug: Web/API/Animation/cancel
+l10n:
+  sourceCommit: ec1006afdf68a5808a48ab6301f9ccff3cd7ecc2
 ---
 
-{{ SeeCompatTable() }}{{ APIRef("Web Animations") }}
+{{ APIRef("Web Animations") }}
 
-Метод **`cancel()`** API Web Animation интерфейса {{domxref("Animation")}} очищает все {{domxref("KeyframeEffect")}} вызванной этой анимацией и прекращает его воспроизведение.
+Метод **`cancel()`** Web Animation API интерфейса {{domxref("Animation")}} очищает все {{domxref("KeyframeEffect")}}, вызванные этой анимацией и прекращает воспроизведение.
 
 > [!NOTE]
 > Когда анимация отменена, её {{domxref("Animation.startTime", "startTime")}} и {{domxref("Animation.currentTime", "currentTime")}} устанавливаются в `null`.
 
-## Syntax
+## Синтаксис
 
-```
-Animation.cancel();
+```js-nolint
+cancel()
 ```
 
-### Parameters
+### Параметры
 
-None.
+Нет.
 
-### Return value
+### Возвращаемое значение
 
-None.
+Нет ({{jsxref("undefined")}}).
 
-### Exceptions
+### Исключения
 
-Этот метод не выбрасывает напрямую исключения; однако, если {{domxref("Animation.playState", "playState")}} анимации во время отмены ничего кроме `"idle"`, {{domxref("Animation.finished", "current finished promise", "", 1)}} отклоняется с помощью {{domxref("DOMException")}} названным `AbortError`.
+Этот метод напрямую не выбрасывает исключения, однако, если {{domxref("Animation.playState", "playState")}} анимации во время отмены является `"idle"`, то {{domxref("Animation.finished", "промис завершения текущей анимации", "", 1)}} отклоняется с {{domxref("DOMException")}} и именем `AbortError`.
 
 ## Спецификации
 
@@ -42,4 +44,4 @@ None.
 - {{domxref("KeyframeEffect")}}
 - {{domxref("Animation")}}
 - {{domxref("Animation.playState")}}
-- {{domxref("Animation.finished")}} returns the promise this action will reject if the animation's `playState` is not `"idle"`.
+- {{domxref("Animation.finished")}} возвращает промис, который отменит это действие, если `playState` анимации не `"idle"`.

From a090bf24a66efa134c472e99260500e748e7b7ce Mon Sep 17 00:00:00 2001
From: Leonid Vinogradov <win.leon@protonmail.com>
Date: Sat, 28 Sep 2024 16:45:28 +0200
Subject: [PATCH 16/43] [ru] update APIRef macro usage (#23279)

* [ru] update APIRef macro usage
---
 .../learn/javascript/building_blocks/event_bubbling/index.md  | 4 ----
 files/ru/web/api/document/defaultview/index.md                | 2 +-
 files/ru/web/api/settimeout/index.md                          | 4 ++--
 files/ru/web/api/window/sessionstorage/index.md               | 4 ++--
 4 files changed, 5 insertions(+), 9 deletions(-)

diff --git a/files/ru/learn/javascript/building_blocks/event_bubbling/index.md b/files/ru/learn/javascript/building_blocks/event_bubbling/index.md
index 109a274c6d3164..8f43d6d64f8fe0 100644
--- a/files/ru/learn/javascript/building_blocks/event_bubbling/index.md
+++ b/files/ru/learn/javascript/building_blocks/event_bubbling/index.md
@@ -4,10 +4,6 @@ slug: Learn/JavaScript/Building_blocks/Event_bubbling
 original_slug: Web/API/Event/Comparison_of_Event_Targets
 ---
 
-{{ ApiRef() }}
-
-### Event targets
-
 Легко запутаться в том, какую цель (target) следует изучить при написании обработчика событий. В этой статье разъяснено использование свойств target.
 
 Существуют 5 целей для рассмотрения:
diff --git a/files/ru/web/api/document/defaultview/index.md b/files/ru/web/api/document/defaultview/index.md
index 535033af175295..059caf01c0580c 100644
--- a/files/ru/web/api/document/defaultview/index.md
+++ b/files/ru/web/api/document/defaultview/index.md
@@ -5,7 +5,7 @@ l10n:
   sourceCommit: 0a881eea07f0cec6ca4ed85a24af43b367a9f80d
 ---
 
-{{ApiRef}}
+{{APIRef}}
 
 В браузерах **`document.defaultView`** возвращает объект
 {{domxref("Window", "window")}}, связанный с {{Glossary("Browsing_context", "документом")}}, или `null` если документ не доступен.
diff --git a/files/ru/web/api/settimeout/index.md b/files/ru/web/api/settimeout/index.md
index 580bf91e16063e..aab96f1831ddc0 100644
--- a/files/ru/web/api/settimeout/index.md
+++ b/files/ru/web/api/settimeout/index.md
@@ -1,9 +1,9 @@
 ---
-title: WindowTimers.setTimeout()
+title: Глобальная функция setTimeout()
 slug: Web/API/setTimeout
 ---
 
-{{ APIRef() }}
+{{APIRef("HTML DOM")}} {{AvailableInWorkers}}
 
 ## Краткое изложение
 
diff --git a/files/ru/web/api/window/sessionstorage/index.md b/files/ru/web/api/window/sessionstorage/index.md
index 1f8e0dec74fc36..b7604875e894c8 100644
--- a/files/ru/web/api/window/sessionstorage/index.md
+++ b/files/ru/web/api/window/sessionstorage/index.md
@@ -1,9 +1,9 @@
 ---
-title: Window.sessionStorage
+title: "Window: свойство sessionStorage"
 slug: Web/API/Window/sessionStorage
 ---
 
-{{APIRef()}}
+{{APIRef("Web Storage API")}}
 
 `Свойство sessionStorage` позволяет получить доступ к объекту {{domxref("Storage")}} текущей сессии. Свойство sessionStorage очень похоже на свойство {{domxref("Window.localStorage")}}, единственное различие заключается в том, что все данные, сохранённые в localStorage не имеют определённого времени жизни, а данные в sessionStorage очищаются в момент окончания сессии текущий страницы. Сессия страницы остаётся активной все время пока окно браузера открыто и сохраняется между перезагрузками страниц. **Открытие той же страницы в новом окне браузера или новой вкладке приводит к созданию новой сессии страницы,** что отличается от поведения session cookies**.**
 

From 2f151badcd9d9a3ffb1cee94fd3c28febadced53 Mon Sep 17 00:00:00 2001
From: Leonid Vinogradov <win.leon@protonmail.com>
Date: Sat, 28 Sep 2024 16:54:30 +0200
Subject: [PATCH 17/43] [ru] update `Web/API/Window/self` translation (#23269)

[ru] update 'Web/API/Window/self' translation
---
 files/ru/web/api/window/self/index.md | 29 ++++++++++++++-------------
 1 file changed, 15 insertions(+), 14 deletions(-)

diff --git a/files/ru/web/api/window/self/index.md b/files/ru/web/api/window/self/index.md
index 5f24950a8e5cfc..5531b31177a845 100644
--- a/files/ru/web/api/window/self/index.md
+++ b/files/ru/web/api/window/self/index.md
@@ -1,31 +1,32 @@
 ---
-title: Window.self
+title: "Window: свойство self"
 slug: Web/API/Window/self
+l10n:
+  sourceCommit: cc070123f72376faec06e36622c4fc723a75325f
 ---
 
-{{ APIRef() }}
+{{APIRef}}
 
-Свойство **`Window.self`** доступно только для чтения и возвращает объект window в виде объекта {{domxref("WindowProxy")}}. Для доступа к данному свойству возможно использовать точечную нотацию и объект `window` (`window.self`) или переменную `self`. Преимущество доступа через переменную `self` заключается в том, что её можно использовать в окружениях, в которых нет window, например {{domxref("Worker", "Web Workers")}}. Использование `self` даёт возможность обращаться к глобальному объекту не только в окружениях где есть window (в таком случае `self` эквивалентна `window.self`), но также в воркерах (в случае воркера `self` эквивалентна {{domxref("WorkerGlobalScope.self")}}).
+Доступное только для чтения свойство **`Window.self`** возвращает само окно в виде объекта {{domxref("WindowProxy")}}. Оно может быть использовано вместе с точечной нотацией на объекте `window` (как `window.self`) или просто `self`. Преимущество доступа через `self` заключается в том, что такую нотацию можно использовать в окружениях, в которых нет объекта `window`, например {{domxref("Worker", "Web Workers")}}. Использование `self` даёт возможность обращаться к глобальному объекту не только в окружениях где есть `window` (в таком случае `self` эквивалентно `window.self`), но также в контексте воркерах (тогда `self` будет эквивалентно {{domxref("WorkerGlobalScope.self")}}).
 
-## Пример
+## Примеры
 
-В следующем примере `window.self` точно также может быть заменено на `window`.
+В следующем примере `window.self` может быть заменено на `window`.
 
 ```js
 if (window.parent.frames[0] != window.self) {
-  // этот window не является первым frame в списке
+  // это окно не является первым в списке
 }
 ```
 
-Кроме того, когда код выполняется в активном документе браузера, объект `window` является ссылкой на текущий глобальный объект и таким образом:
+Кроме того, когда код выполняется в активном документе браузера, объект `window` является ссылкой на текущий глобальный объект, и поэтому всё следующее эквивалентно:
 
 ```js
-var w1 = window;
-var w2 = self;
-var w3 = window.window;
-var w4 = window.self;
-// Значения переменных w1, w2, w3, w4 строго равны между собой
-// Но только переменная w2 будет работать в workers
+const w1 = window;
+const w2 = self;
+const w3 = window.window;
+const w4 = window.self;
+// w1, w2, w3, w4 равнозначны, но только w2 будет работать в workers
 ```
 
 ## Спецификации
@@ -38,4 +39,4 @@ var w4 = window.self;
 
 ## Смотрите также
 
-- Its `Worker` equivalent, {{domxref("WorkerGlobalScope.self")}}.
+- {{domxref("WorkerGlobalScope.self")}} — эквивалент для' `Worker`.

From bffb598c4e90318d2c5151d51943a349967f156a Mon Sep 17 00:00:00 2001
From: Leonid Vinogradov <win.leon@protonmail.com>
Date: Sat, 28 Sep 2024 16:54:48 +0200
Subject: [PATCH 18/43] [ru] fix links in `Learn/HTML/Tables/Advanced` (#23270)

* [ru] fix links in 'Learn/HTML/Tables/Advanced'

---------

Co-authored-by: Artem Shibakov <shibakow@gmail.com>
---
 files/ru/learn/html/tables/advanced/index.md | 22 +++++++-------------
 1 file changed, 8 insertions(+), 14 deletions(-)

diff --git a/files/ru/learn/html/tables/advanced/index.md b/files/ru/learn/html/tables/advanced/index.md
index 383a6cdaaa20ab..6ad640e8b48440 100644
--- a/files/ru/learn/html/tables/advanced/index.md
+++ b/files/ru/learn/html/tables/advanced/index.md
@@ -30,18 +30,18 @@ slug: Learn/HTML/Tables/Advanced
 Заголовок помещают сразу после тега `<table>`.
 
 > [!NOTE]
-> Атрибут [`summary`](/ru/docs/Web/HTML/Element/table#summary) также может быть использован в `<table>` элементе предоставляя описание — это также читается скринридерами. Однако мы рекомендуем вместо этого использовать `<caption>` элемент, так как `summary` {{glossary("deprecated")}} в HTML5 спецификации и не может быть прочитан зрячими пользователями (он не отображается на странице).
+> Атрибут [`summary`](/ru/docs/Web/HTML/Element/table#summary) также может быть использован в элементе `<table>` для добавления описания, которое также будет распознано программами для чтения с экрана. Однако мы рекомендуем вместо этого использовать элемент `<caption>`, так как `summary` является устаревшим и не может быть прочитан зрячими пользователями (он не отображается на странице).
 
 ### Упражнение: Добавление заголовка
 
 Давайте попробуем это, вернёмся к примеру который мы ранее встретили в прошлой статье.
 
-1. Откройте расписание занятий школьного учителя по языку в конце статьи [HTML таблицы основы](/ru/docs/Learn/HTML/Tables/Basics#Active_learning_colgroup_and_col), или сделайте копию нашего [timetable-fixed.html](https://github.com/mdn/learning-area/blob/master/html/tables/basic/timetable-fixed.html) файла.
+1. Откройте расписание занятий школьного учителя по языку в конце статьи [HTML таблицы основы](/ru/docs/Learn/HTML/Tables/Basics#active_learning_colgroup_and_col) или сделайте копию нашего [timetable-fixed.html](https://github.com/mdn/learning-area/blob/master/html/tables/basic/timetable-fixed.html) файла.
 2. Добавьте подходящий заголовок к таблице.
 3. Сохраните свой код и откройте его в браузере, чтобы посмотреть как это выглядит.
 
 > [!NOTE]
-> Этот пример можно найти на GitHub по ссылке [timetable-caption.html](https://github.com/mdn/learning-area/blob/master/html/tables/advanced/timetable-caption.html) ([живой пример](http://mdn.github.io/learning-area/html/tables/advanced/spending-record-finished.html)).
+> Этот пример можно найти на GitHub по ссылке [timetable-caption.html](https://github.com/mdn/learning-area/blob/master/html/tables/advanced/timetable-caption.html) ([живой пример](https://mdn.github.io/learning-area/html/tables/advanced/timetable-caption.html)).
 
 ## Добавление структуры с помощью \<thead>, \<tfoot> и \<tbody>
 
@@ -55,7 +55,7 @@ slug: Learn/HTML/Tables/Advanced
 - Элементом `<tfoot>` нужно обернуть ту часть, которая относится к footer таблицы — например, это может быть последняя строка в которой отражаются суммы по столбцам таблицы. Вы можете включить сюда footer таблицы, как и следовало ожидать, или чуть ниже заголовка таблицы (браузер всё равно отобразит его внизу таблицы).
 - Элементом `<tbody>` необходимо обернуть остальную часть содержимого таблицы которая не находится в header или footer таблицы. Этот блок располагают ниже заголовка таблицы или иногда footer таблицы, зависит от того какую структуру вы решите использовать (читать выше по тексту).
 
-> **Примечание:** `<tbody>` всегда включён в каждой таблице, неявно если не укажете его в коде. Проверьте это, открыв один из предыдущих примеров в котором не используется `<tbody>` и посмотрите HTML код в [browser developer tools](/ru/docs/Learn/Common_questions/What_are_browser_developer_tools) — вы увидите, что браузер добавил этот тег самостоятельно. Вы могли бы задаться вопросом почему мы должны волноваться о его включении, но вы должны, потому что это даёт больше контроля над структурой таблицы и стилем.
+> **Примечание:** `<tbody>` всегда есть в каждой таблице, даже если он не указывается коде явно. Вы можете убедиться в этом, открыв один из предыдущих примеров в котором не используется `<tbody>` и посмотрев HTML код в [Developer Tools браузера](/ru/docs/Learn/Common_questions/Tools_and_setup/What_are_browser_developer_tools) — вы увидите, что браузер добавил этот тег самостоятельно. Вы могли бы задаться вопросом почему мы должны волноваться о его включении, но вы должны, потому что это даёт больше контроля над структурой таблицы и стилем.
 
 ### Упражнение: Добавление структуры таблицы
 
@@ -82,7 +82,7 @@ slug: Learn/HTML/Tables/Advanced
 7. Сохраните, обновите и вы увидите результат. Если `<tbody>` и `<tfoot>` элементы не были установлены, то вам придётся писать много сложных селекторов/правил для применения одного и того же стиля.
 
 > [!NOTE]
-> Мы не ожидаем что сейчас вы полностью поймёте CSS. Вы узнаете больше когда пройдёте наши CSS курсы (например, [Вступление в CSS](/ru/docs/Learn/CSS/Introduction_to_CSS) это хорошее место для начала; у нас также есть статья конкретно о [стилизации таблиц](/ru/docs/Learn/CSS/Building_blocks/Styling_tables)).
+> Мы не ожидаем что сейчас вы полностью поймёте CSS. Вы узнаете больше когда пройдёте наши CSS курсы (например, [Введение в CSS](/ru/docs/Learn/CSS/First_steps) это хорошее место для начала; у нас также есть статья конкретно о [стилизации таблиц](/ru/docs/Learn/CSS/Building_blocks/Styling_tables)).
 
 Ваша готовая таблица должна выглядеть примерно так:
 
@@ -198,7 +198,7 @@ slug: Learn/HTML/Tables/Advanced
 {{ EmbedLiveSample('Hidden_example', '100%', 300) }}
 
 > [!NOTE]
-> Этот пример можно также найти на GitHub по ссылке [spending-record-finished.html](https://github.com/mdn/learning-area/blob/master/html/tables/advanced/spending-record-finished.html) ([живой пример](http://mdn.github.io/learning-area/html/tables/advanced/spending-record-finished.html)).
+> Этот пример можно также найти на GitHub по ссылке [spending-record-finished.html](https://github.com/mdn/learning-area/blob/master/html/tables/advanced/spending-record-finished.html) ([живой пример](https://mdn.github.io/learning-area/html/tables/advanced/spending-record-finished.html)).
 
 ## Вложенные таблицы
 
@@ -389,16 +389,10 @@ slug: Learn/HTML/Tables/Advanced
 3. И наконец попробуем сделать другую копию изначальных файлов, на этот раз делая таблицу более доступной используя атрибуты `id` и `headers`.
 
 > [!NOTE]
-> Вы можете проверить как работает последние примеры здесь [items-sold-scope.html](https://github.com/mdn/learning-area/blob/master/html/tables/advanced/items-sold-scope.html) ([also see this live](http://mdn.github.io/learning-area/html/tables/advanced/items-sold-scope.html)) и [items-sold-headers.html](https://github.com/mdn/learning-area/blob/master/html/tables/advanced/items-sold-headers.html) ([see this live too](http://mdn.github.io/learning-area/html/tables/advanced/items-sold-headers.html)).
+> Вы можете проверить как работает последние примеры здесь [items-sold-scope.html](https://github.com/mdn/learning-area/blob/master/html/tables/advanced/items-sold-scope.html) ([живой пример](https://mdn.github.io/learning-area/html/tables/advanced/items-sold-scope.html)) и [items-sold-headers.html](https://github.com/mdn/learning-area/blob/master/html/tables/advanced/items-sold-headers.html) ([живой пример](https://mdn.github.io/learning-area/html/tables/advanced/items-sold-headers.html)).
 
 ## Заключение
 
-Есть ещё некоторые вещи которые можно узнать о HTML таблицах, но мы действительно дали всё что нужно на настоящий момент. Дальше вы возможно захотите больше узнать о стилизации HTML таблиц, посмотрите статью ["Стилизация таблиц"](/ru/docs/Learn/CSS/Styling_boxes/Styling_tables).
+Есть ещё некоторые вещи которые можно узнать о HTML таблицах, но мы действительно дали всё что нужно на настоящий момент. Дальше вы возможно захотите больше узнать о стилизации HTML таблиц, посмотрите статью ["Стилизация таблиц"](/ru/docs/Learn/CSS/Building_blocks/Styling_tables).
 
 {{PreviousMenuNext("Learn/HTML/Tables/Basics", "Learn/HTML/Tables/Structuring_planet_data", "Learn/HTML/Tables")}}
-
-## В этом блоке
-
-- [HTML таблицы основы](/ru/docs/Learn/HTML/Tables/Basics)
-- [HTML таблицы продвинутые возможности и доступность](/ru/docs/Learn/HTML/Tables/Advanced)
-- [Структурирование данных о планетах](/ru/docs/Learn/HTML/Tables/Structuring_planet_data)

From 6fc61d2469d7970c1d3cfbbaebca72c0b5f75791 Mon Sep 17 00:00:00 2001
From: Leonid Vinogradov <win.leon@protonmail.com>
Date: Sat, 28 Sep 2024 16:57:05 +0200
Subject: [PATCH 19/43] [ru] update `Web/API/Window/scrollBy` translation
 (#23236)

[ru] update 'Web/API/Window/scrollBy' translation
---
 files/ru/web/api/window/scrollby/index.md | 60 +++++++++++++++++------
 1 file changed, 46 insertions(+), 14 deletions(-)

diff --git a/files/ru/web/api/window/scrollby/index.md b/files/ru/web/api/window/scrollby/index.md
index ae7b652510e17b..a927f714dc8fd5 100644
--- a/files/ru/web/api/window/scrollby/index.md
+++ b/files/ru/web/api/window/scrollby/index.md
@@ -1,37 +1,69 @@
 ---
-title: Window.scrollBy()
+title: "Window: метод scrollBy()"
 slug: Web/API/Window/scrollBy
+l10n:
+  sourceCommit: 62cedc63226017e9e7d0718b6fea3529ca8dbf37
 ---
 
-{{ APIRef() }}
+{{APIRef}}
 
-## Описание
-
-Прокручивает документ на указанные величины.
+Метод **`Window.scrollBy()`** прокручивает документ в окне на указанную величину.
 
 ## Синтаксис
 
-```
-window.scrollBy(X, Y);
+```js-nolint
+scrollBy(x-coord, y-coord)
+scrollBy(options)
 ```
 
 ### Параметры
 
-- `X` - смещение в пикселях по горизонтали.
-- `Y` - смещение в пикселях по вертикали.
+- `x-coord` смещение в пикселях по горизонтали.
+- `y-coord` смещение в пикселях по вертикали.
 
-Положительные значения приведут к прокрутке страницы вправо и вниз. Отрицательные координаты прокрутят страницу влево и вверх.
+\- или -
 
-## Пример
+- `options`
 
-```
-// Прокрутка на один экран вертикально вниз.
+  - : Объект, содержащий следующие свойства:
+    - `top`
+      - : Указывает количество пикселей по оси Y для прокрутки окна или элемента.
+    - `left`
+      - : Указывает количество пикселей по оси X для прокрутки окна или элемента.
+    - `behavior`
+      - : Указывает, нужно ли анимировать прокрутку плавно (`smooth`), быстрым перемещением (`instant`) или предоставить выбор браузеру (`auto`, по умолчанию).
+
+### Возвращаемое значение
+
+Нет ({{jsxref("undefined")}}).
+
+## Примеры
+
+Для прокрутки вниз страницы:
+
+```js
 window.scrollBy(0, window.innerHeight);
 ```
 
+Для прокрутки вверх:
+
+```js
+window.scrollBy(0, -window.innerHeight);
+```
+
+С использованием `options`:
+
+```js
+window.scrollBy({
+  top: 100,
+  left: 100,
+  behavior: "smooth",
+});
+```
+
 ## Примечания
 
-[window.scrollBy](/ru/docs/DOM/Window.scrollBy) прокручивает страницу на указанное количество пикселей, в то время как метод [window.scroll](/ru/docs/DOM/Window.scroll) указывает абсолютную позицию в документе, на которую надо сместиться. Смотрите также [window.scrollByLines](/ru/docs/DOM/Window.scrollByLines), [window.scrollByPages](/ru/docs/DOM/Window.scrollByPages)
+`window.scrollBy()` прокручивает страницу на указанное количество пикселей, в то время как метод {{domxref("window.scroll()")}} прокручивает к абсолютной позиции в документе. Смотрите также {{domxref("window.scrollByLines()")}} и {{domxref("window.scrollByPages()")}}.
 
 ## Спецификации
 

From 9d79001f257ce3fb20ffba18729e95f46efe0605 Mon Sep 17 00:00:00 2001
From: Masahiro FUJIMOTO <mfujimot@gmail.com>
Date: Tue, 24 Sep 2024 08:56:38 +0900
Subject: [PATCH 20/43] =?UTF-8?q?2024/09/10=20=E6=99=82=E7=82=B9=E3=81=AE?=
 =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=9F=BA=E3=81=A5=E3=81=8D?=
 =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 files/ja/web/css/reference/index.md | 23 +++++++++++------------
 1 file changed, 11 insertions(+), 12 deletions(-)

diff --git a/files/ja/web/css/reference/index.md b/files/ja/web/css/reference/index.md
index a3fc7e07fbed34..d38d75f0e594bb 100644
--- a/files/ja/web/css/reference/index.md
+++ b/files/ja/web/css/reference/index.md
@@ -2,7 +2,7 @@
 title: CSS リファレンス
 slug: Web/CSS/Reference
 l10n:
-  sourceCommit: 62c5c3f5655002f230bf0153fbdf8a883611014a
+  sourceCommit: 583d48191a7a8605d831aff357bef6cc63aef2e3
 ---
 
 {{CSSRef}}
@@ -13,7 +13,7 @@ l10n:
 
 ### スタイルルールの構文
 
-```
+```css
 スタイルルール ::=
     セレクターリスト {
       プロパティリスト
@@ -22,7 +22,7 @@ l10n:
 
 ここで、
 
-```
+```css
 セレクターリスト ::=
     セレクター[:擬似クラス] [::擬似要素]
     [, セレクターリスト]
@@ -45,7 +45,7 @@ div.menu-bar li:hover > ul {
 }
 ```
 
-初心者レベルの CSS セレクター構文への入門については、 [CSS セレクターのガイド](/ja/docs/Learn/CSS/Building_blocks/Selectors)をご覧ください。ルール定義内での [CSS 構文](/ja/docs/Web/CSS/Syntax) エラーは、そのルール全体を無効にするので十分に注意してください。無効なルールはブラウザーにより無視されます。 CSS ルールの定義はすべて (ASCII) [テキストベース](https://www.w3.org/TR/css-syntax-3/#intro) であり、DOM-CSS / CSSOM (ルール管理システム) は [オブジェクトベース](https://www.w3.org/TR/cssom/#introduction) なので注意してください。
+初心者レベルの CSS セレクター構文への入門については、 [CSS セレクターのガイド](/ja/docs/Learn/CSS/Building_blocks/Selectors)をご覧ください。ルール定義内での [CSS 構文](/ja/docs/Web/CSS/Syntax) エラーは、そのルール全体を無効にするので十分に注意してください。無効なルールはブラウザーにより無視されます。 CSS ルールの定義はすべて ({{Glossary("ASCII")}}) [テキストベース](https://www.w3.org/TR/css-syntax-3/#intro) であり、DOM-CSS / CSSOM (ルール管理システム) は [オブジェクトベース](https://www.w3.org/TR/cssom/#introduction) なので注意してください。
 
 ### アットルールの構文
 
@@ -53,6 +53,9 @@ div.menu-bar li:hover > ul {
 
 ## 索引
 
+> [!NOTE]
+> この索引は、[SVG](/ja/docs/Web/SVG) 要素上で CSS プロパティとして使える SVG 専用プレゼンテーション属性を含んでいません。
+
 > [!NOTE]
 > この索引でのプロパティ名は、CSS 標準の名前と異なる JavaScript の名前は含んでいません。
 
@@ -60,7 +63,7 @@ div.menu-bar li:hover > ul {
 
 ## セレクター
 
-以下は様々な[セレクター](/ja/docs/Web/CSS/CSS_Selectors)で、 DOM 内の要素の様々な特徴に基づいた条件付きのスタイル付けを可能にします。
+以下は様々な[セレクター](/ja/docs/Web/CSS/CSS_selectors)で、DOM 内の要素の様々な特徴に基づいた条件付きのスタイル付けを可能にします。
 
 ### 基本セレクター
 
@@ -99,7 +102,7 @@ div.menu-bar li:hover > ul {
 - [擬似要素](/ja/docs/Web/CSS/Pseudo-elements) `::`
   - : HTML に含まれていないエンティティを表します。
 
-> **メモ:** **関連情報:** [Selectors Level 4 仕様書におけるセレクター](https://www.w3.org/TR/selectors/#overview)。
+> **注目:** [Selectors Level 4 仕様書におけるセレクター](https://www.w3.org/TR/selectors/#overview)および[擬似要素の仕様書](https://drafts.csswg.org/css-pseudo/)も参照してください。
 
 ## 概念
 
@@ -128,7 +131,7 @@ div.menu-bar li:hover > ul {
 
 ### レイアウト
 
-- [ブロック整形コンテキスト](/ja/docs/Web/Guide/CSS/Block_formatting_context)
+- [ブロック整形コンテキスト](/ja/docs/Web/CSS/CSS_display/Block_formatting_context)
 - [ボックスモデル](/ja/docs/Web/CSS/CSS_box_model/Introduction_to_the_CSS_box_model)
 - [包含ブロック](/ja/docs/Web/CSS/Containing_block)
 - [レイアウトモード](/ja/docs/Web/CSS/Layout_mode)
@@ -142,11 +145,7 @@ div.menu-bar li:hover > ul {
 ### 主なオブジェクトの種類
 
 - {{DOMxRef("Document.styleSheets")}}
-- `{{DOMxRef("StyleSheetList", "styleSheets", "", 1)}}[i].{{DOMxRef("CSSRuleList", "cssRules", "", 1)}}`
-- `cssRules[i].{{DOMxRef("CSSRule.cssText", "cssText", "", 1)}}` (セレクターとスタイル)
-- `cssRules[i].{{DOMxRef("CSSStyleRule.selectorText", "selectorText", "", 1)}}`
 - {{DOMxRef("HTMLElement.style")}}
-- `HTMLElement.style.{{DOMxRef("CSSStyleDeclaration.cssText", "cssText", "", 1)}}` (スタイルのみ)
 - {{DOMxRef("Element.className")}}
 - {{DOMxRef("Element.classList")}}
 
@@ -162,4 +161,4 @@ div.menu-bar li:hover > ul {
 
 ## 外部リンク
 
-- [CSS 目次 (w3.org)](https://www.w3.org/TR/CSS/#indices)
+- [CSS 索引 (w3.org)](https://www.w3.org/TR/CSS/#indices)

From 53da5633beb13ebc9d888e66f5834042c969f3d2 Mon Sep 17 00:00:00 2001
From: Masahiro FUJIMOTO <mfujimot@gmail.com>
Date: Tue, 24 Sep 2024 15:52:45 +0900
Subject: [PATCH 21/43] =?UTF-8?q?=E4=BE=8B=E3=81=AE=E7=AF=80=E3=81=AE?=
 =?UTF-8?q?=E8=AA=AC=E6=98=8E=E6=96=87=E3=81=AE=E7=BF=BB=E8=A8=B3=E5=BF=98?=
 =?UTF-8?q?=E3=82=8C=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 files/ja/web/css/scrollbar-gutter/index.md | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/files/ja/web/css/scrollbar-gutter/index.md b/files/ja/web/css/scrollbar-gutter/index.md
index d9fd88921a7c2d..7f6214348a8c7c 100644
--- a/files/ja/web/css/scrollbar-gutter/index.md
+++ b/files/ja/web/css/scrollbar-gutter/index.md
@@ -53,14 +53,14 @@ scrollbar-gutter: unset;
 
 ## 例
 
-The examples below show how the different values for the `scrollbar-gutter` property would affect a scrollable `div` element (`.container`) with one or more paragraphs contained within.
+次の例は、`scrollbar-gutter` プロパティの異なる値が、1 つ以上の段落を含むスクロール可能な `div` 要素（`.container`）にどのように影響するかを示しています。
 
 > [!NOTE]
-> In the images for the examples, the user's system settings are set to classic scrollbars (always shown).
+> 例の画像では、ユーザーのシステム設定は従来のスクロールバー（常に表示）に設定されています。
 
 ### 例 1
 
-Prevent unneeded layout changes as the content growing or shrinking causes the scrollbar to appear/disappear, a space is reserved for it.
+コンテンツが大きくなったり小さくなったりすることでスクロールバーが表示されたり消えたりするため、そのための空間が確保され、不要なレイアウト変更を防ぐことができます。
 
 ```css
 .container {
@@ -68,11 +68,11 @@ Prevent unneeded layout changes as the content growing or shrinking causes the s
 }
 ```
 
-![A containing div element with a paragraph of text inside and a space to the right where the scrollbar is](stable-no-scroll.png)
+![div 要素の中にテキストの段落があり、スクロールバーの右側に空間がある。](stable-no-scroll.png)
 
 ### 例 2
 
-Add symmetric spacing to both sides of the box so the content is centered:
+ボックスの両側に左右対称の空間を追加し、コンテンツが中央に来るようにします。
 
 ```css
 .container {
@@ -80,12 +80,12 @@ Add symmetric spacing to both sides of the box so the content is centered:
 }
 ```
 
-![A containing div element with a paragraph of text inside, a space to the right where the scrollbar is and a matching empty space to the left](stable-both-edges.png)
+![テキストの段落を含む div 要素で、スクロールバーがある右側に空間があり、左側に同じ空間がある。](stable-both-edges.png)
 
 ### 例 3
 
-Align the contents of a non-scrolling element and a scrolling one adjacent to it:
-This example shows two divs side by side. The one on the left has no scroll, but the one on the right does. Both have `scrollbar-gutter` applied, which also reserves space for the div on the left which doesn't have scrollable content. This is a good technique to use to keep the width of content consistent.
+スクロールしない要素と、それに隣接するスクロールする要素の内容を揃えます。
+この例では、2 つの div を横に並べています。左側のものはスクロールしませんが、右側のものはスクロールします。両方とも `scrollbar-gutter` が適用されており、スクロール可能なコンテンツを持たない左側の div のための空間も確保されています。これは、コンテンツの幅を一定に保つために使う良いテクニックです。
 
 ```css
 .container1 {
@@ -98,13 +98,13 @@ This example shows two divs side by side. The one on the left has no scroll, but
 }
 ```
 
-![Two adjacent divs containing text, both with space for a scrollbar](side-by-side.png)
+![テキストを含む 2 つの隣接する div で、両方ともスクロールバーのための空間がある。](side-by-side.png)
 
 ### スクロールバーのオーバーレイ
 
-For reference, this image shows the same div as above, but with the user's system settings set to overlay scrollbars. Note here the scrollbar will only show when the user is scrolling and on top of the content, so no space is reserved for it and the `scrollbar-gutter` property has no effect.
+参考までに、この画像は上記と同じ div を示していますが、ユーザーのシステム設定がスクロールバーをオーバーレイするように設定されています。ここでは、スクロールバーはユーザーがスクロールしているときだけ表示され、コンテンツの上に表示されるため、スクロールバーのための空間は確保されず、`scrollbar-gutter` プロパティは影響しないことに注意してください。
 
-![One div with text, no visible scrollbar](for-ref-no-scroll.png)
+![テキストを含む 1 つの div、スクロールバーなし](for-ref-no-scroll.png)
 
 ## 仕様書
 

From f3267d8b0f4252b2d49e56e9d9cc4b3a9c370a71 Mon Sep 17 00:00:00 2001
From: Masahiro FUJIMOTO <mfujimot@gmail.com>
Date: Tue, 24 Sep 2024 23:58:48 +0900
Subject: [PATCH 22/43] =?UTF-8?q?2024/07/27=20=E6=99=82=E7=82=B9=E3=81=AE?=
 =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=9F=BA=E3=81=A5=E3=81=8D?=
 =?UTF-8?q?=E6=96=B0=E8=A6=8F=E7=BF=BB=E8=A8=B3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../resolving_relative_references/index.md    | 164 ++++++++++++++++++
 1 file changed, 164 insertions(+)
 create mode 100644 files/ja/web/api/url_api/resolving_relative_references/index.md

diff --git a/files/ja/web/api/url_api/resolving_relative_references/index.md b/files/ja/web/api/url_api/resolving_relative_references/index.md
new file mode 100644
index 00000000000000..83fab003471d2e
--- /dev/null
+++ b/files/ja/web/api/url_api/resolving_relative_references/index.md
@@ -0,0 +1,164 @@
+---
+title: 相対参照の URL への解決
+slug: Web/API/URL_API/Resolving_relative_references
+l10n:
+  sourceCommit: 216794e76611c18e53222bb8efa570e898e990de
+---
+
+{{DefaultAPISidebar("URL API")}}
+
+[`URL()` コンストラクター](/ja/docs/Web/API/URL/URL)、または {{domxref("URL.parse_static", "URL.parse()")}} 静的メソッド ([URL API](/ja/docs/Web/API/URL_API)) を使用すると、相対参照とベース URL を絶対 URL に解決することができます。
+
+どちらのメソッドも、最大 2 つの文字列引数を取り、絶対 URL を表す [`URL()`](/ja/docs/Web/API/URL) オブジェクトを返します。
+最初の引数は絶対 URL または URL への相対参照を表し、2 番目の引数は、最初の引数に相対参照が指定されている場合にその相対参照を解決するために使用されるベース URL です。
+これらのメソッドは、無効な URL が渡されると `URL()` コンストラクターがエラーを発生させるのに対し、`parse()` は `null` を返すという点を除いて、同じ方法で相対参照を解決します。
+
+下記コードは、同じ `url` および `base` URL 値を使用してメソッドがどのように使用されるかを示しています。
+
+```js
+const url = "articles";
+const base = "https://developer.mozilla.org/some/path";
+const constructorResult = new URL(url, base);
+// => https://developer.mozilla.org/some/articles
+const parseResult = URL.parse(url, base);
+// => https://developer.mozilla.org/some/articles
+```
+
+例えば、指定されたベース URL と相対参照から `URL` を解決することは、単純に指定された引数を結合するだけではないことが分かります。
+
+この場合、カレントディレクトリーに相対するパス (`articles`) が渡されます。
+ベース URL のカレントディレクトリーは、最後のスラッシュまでの URL 文字列です。
+この例では、`https://developer.mozilla.org/some/path` の末尾にスラッシュが指定されていないため、カレントディレクトリーは `https://developer.mozilla.org/some/` となり、最終的な URL は `https://developer.mozilla.org/some/articles` となります。
+
+相対参照は、カレントディレクトリー (`./`)、カレントディレクトリーの親ディレクトリー (`../`)、またはサイトルート (`/`) に対する相対パス参照を使用して、ベース URL に対して解決されます。
+以下の章では、相対パスの各タイプについて、解決の作業方法を表示させます。
+
+## カレンとディレクトリーからの相対
+
+`./` で始まる相対参照、または接頭辞のない参照、例えば `./article`、`article`、`./article/` は、`base` 引数で表される URL のカレントディレクトリーに対する相対参照です。
+
+```html hidden
+<pre id="log"></pre>
+```
+
+```css hidden
+#log {
+  height: 90px;
+  padding: 0.5rem;
+  border: 1px solid black;
+}
+```
+
+```js hidden
+const logElement = document.getElementById("log");
+function log(text) {
+  logElement.innerText += `${text}\n`;
+}
+```
+
+ベース URL のカレントディレクトリーは、最後のスラッシュまでの URL 文字列であり、下記コードブロックのベース文字列どちらも `https://test.example.org/api/` です。
+カレントディレクトリーから相対参照する `article` がこれに追加され、`https://test.example.org/api/article` に解決されます。
+
+```js
+log(new URL("./article", "https://test.example.org/api/").href);
+// => https://test.example.org/api/article
+log(new URL("article", "https://test.example.org/api/v1").href);
+// => https://test.example.org/api/article
+```
+
+同様に、下記どちらのベース URL 文字列も、カレンとディレクトリーは `https://test.example.org/api/v2/` です。
+最終的な URL を解決するために、これらに `story/` と `story` を追加します。
+
+```js
+log(new URL("./story/", "https://test.example.org/api/v2/").href);
+// => https://test.example.org/api/v2/story/
+log(new URL("./story", "https://test.example.org/api/v2/v3").href);
+// => https://test.example.org/api/v2/story
+```
+
+{{EmbedLiveSample('Current directory relative', '100%', '140px')}}
+
+## 親ディレクトリーからの相対
+
+`../` という接頭辞が付いた相対参照、例えば `../path` は、`base` 引数で表される URL の現在のディレクトリーの親ディレクトリーに対する相対参照です。
+`../` の各インスタンスは現在のディレクトリーからフォルダー内を削除し、`../` 以降のテキストは残りのベースパスに追加されます。
+`../` を複数回指定することで親ディレクトリーに移動できますが、サイトルートのレベルまでです。
+
+例えば、ベース URL `https://test.example.com/test/api/v1/` とその親の相対 URL `../some/path` が指定された場合、カレントディレクトリーは `https://test.example.com/test/api/v1/`、親ディレクトリーは `https://test.example.com/test/api/`、解決された絶対 URL は `https://test.example.com/test/api/some/path` となります。
+
+```html hidden
+<pre id="log"></pre>
+```
+
+```css hidden
+#log {
+  height: 80px;
+  padding: 0.5rem;
+  border: 1px solid black;
+}
+```
+
+```js hidden
+const logElement = document.getElementById("log");
+function log(text) {
+  logElement.innerText += `${text}\n`;
+}
+```
+
+次の例では、この点をより詳しく説明します。
+すべてのケースにおいて、カレントディレクトリーは `https://test.example.org/api/v1/v2/` です（2 つ目のケースでは、`v3` が最後のスラッシュの後に続きます）。相対参照はそれぞれ異なる親ディレクトリを指します。
+
+```js
+log(new URL("../path", "https://test.example.org/api/v1/v2/").href);
+// => https://test.example.org/api/v1/path
+log(new URL("../../path", "https://test.example.org/api/v1/v2/v3").href);
+// => https://test.example.org/api/path
+log(new URL("../../../../path", "https://test.example.org/api/v1/v2/").href);
+// => https://test.example.org/path
+```
+
+{{EmbedLiveSample('Parent-directory relative', '100%')}}
+
+## ルートからの相対
+
+`/` 接頭辞付きの相対参照、たとえば `/path` は、`base` 引数で指定された URL のサイトルートに対する相対パスとなります。
+例えば、ベース URL が `https://test.example.com/api/v1` の場合、ルート相対 URL `/some/path` の解決後の URL は `https://test.example.com/some/path` となります。
+
+> [!NOTE]
+> ルート相対 URL を解決すると、`base` URL のパス部分は関係なくなります。
+
+```html hidden
+<pre id="log"></pre>
+```
+
+```css hidden
+#log {
+  height: 80px;
+  padding: 0.5rem;
+  border: 1px solid black;
+}
+```
+
+```js hidden
+const logElement = document.getElementById("log");
+function log(text) {
+  logElement.innerText += `${text}\n`;
+}
+```
+
+以下に、いくつか例を挙げます。
+
+```js
+log(new URL("/some/path", "https://test.example.org/api/").href);
+// => https://test.example.org/some/path
+log(new URL("/", "https://test.example.org/api/v1/").href);
+// => https://test.example.org/
+log(new URL("/article", "https://example.com/api/v1/").href);
+// => https://example.com/article
+```
+
+{{EmbedLiveSample('Root relative', '100%')}}
+
+## 関連情報
+
+- [RFC 3986 - Relative Resolution](https://datatracker.ietf.org/doc/html/rfc3986.html#section-5.2): ベース及び相対 URL の解決の仕様書

From 26e3e7afa5bfd546ed387c9712dea390e6d8223a Mon Sep 17 00:00:00 2001
From: Masahiro FUJIMOTO <mfujimot@gmail.com>
Date: Wed, 25 Sep 2024 00:08:37 +0900
Subject: [PATCH 23/43] =?UTF-8?q?2024/07/25=20=E6=99=82=E7=82=B9=E3=81=AE?=
 =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=9F=BA=E3=81=A5=E3=81=8D?=
 =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 files/ja/web/api/url/index.md | 24 +++++++++++-------------
 1 file changed, 11 insertions(+), 13 deletions(-)

diff --git a/files/ja/web/api/url/index.md b/files/ja/web/api/url/index.md
index bdec1f504d4f73..cd18c88a5adf3c 100644
--- a/files/ja/web/api/url/index.md
+++ b/files/ja/web/api/url/index.md
@@ -2,23 +2,20 @@
 title: URL
 slug: Web/API/URL
 l10n:
-  sourceCommit: acfe8c9f1f4145f77653a2bc64a9744b001358dc
+  sourceCommit: 32305cc3cf274fbfdcc73a296bbd400a26f38296
 ---
 
-{{APIRef("URL API")}}
+{{APIRef("URL API")}} {{AvailableInWorkers}}
 
 **`URL`** インターフェイスは、{{glossary("URL", "URL")}} の解釈、構築、正規化、およびエンコードに使用します。 URL のコンポーネントを簡単に読み取って変更できるプロパティを提供することで機能します。
 
 通常、新しい `URL` オブジェクトを作成するにはコンストラクターを呼び出すときに URL を文字列として指定するか、相対 URL とベース URL を指定します。その後、解釈された URL のコンポーネントを簡単に読み取ったり、URL を変更したりすることができます。
 
-ブラウザーがまだ {{domxref("URL.URL", "URL()")}} コンストラクターに対応していない場合は、{{domxref("Window")}} インターフェイスの {{domxref("URL")}} プロパティを使用して URL オブジェクトにアクセスできます。対象とするブラウザーのいずれかに、この接頭辞を付ける必要があるかどうかを確認してください。
-
-{{AvailableInWorkers}}
-
 ## コンストラクター
 
 - {{domxref("URL.URL", "URL()")}}
-  - : 絶対 URL 文字列、または相対 URL 文字列とベース URL 文字列を使用して指定された URL を参照する `URL` オブジェクトを作成して返します。
+  - : `URL` オブジェクトを、URL 文字列とオプションのベース URL 文字列から作成し、それを返します。
+    渡された引数が有効な URL を定義していない場合、例外が発生します。
 
 ## プロパティ
 
@@ -49,12 +46,14 @@ l10n:
 
 ## 静的メソッド
 
-- [`canParse()`](/ja/docs/Web/API/URL/canParse_static)
+- {{domxref("URL.canParse_static", "canParse()")}}
   - : URL 文字列とオプションのベース URL 文字列から定義された URL が解釈可能で有効かどうかを示す論理値を返します。
-- {{domxref("URL/createObjectURL_static", "createObjectURL()")}}
+- {{domxref("URL.createObjectURL_static", "createObjectURL()")}}
   - : 一意の blob URL の入った文字列を返します。 これは、スキームとして `blob:` の入った URL で、その後にブラウザー内のオブジェクトを一意に識別する不透明な文字列が続きます。
-- {{domxref("URL/revokeObjectURL_static", "revokeObjectURL()")}}
-  - : {{domxref("URL.createObjectURL_static")}} を使用して以前に生成したオブジェクト URL を取り消します。
+- {{domxref("URL.parse_static", "parse()")}}
+  - : `URL` オブジェクトを、URL 文字列とオプションのベース URL 文字列から作成して返します。渡された引数が無効な `URL` を定義している場合は、`null` を返します。
+- {{domxref("URL.revokeObjectURL_static", "revokeObjectURL()")}}
+  - : {{domxref("URL.createObjectURL_static", "URL.createObjectURL()")}} を使用して以前に生成したオブジェクト URL を取り消します。
 
 ## メソッド
 
@@ -74,7 +73,7 @@ console.log(url.pathname); // "/cats"
 ```
 
 コンストラクターは URL を有効な URL に解釈できない場合に例外を発生させます。
-上記のコードを [`try...catch`](/ja/docs/Web/JavaScript/Reference/Statements/try...catch) ブロックの中で呼び出すか、[`canParse()`](/ja/docs/Web/API/URL/canParse_static) 静的メソッドを使って先に URL が有効かどうかをチェックしてください。
+上記のコードを [`try...catch`](/ja/docs/Web/JavaScript/Reference/Statements/try...catch) ブロックの中で呼び出すか、{{domxref("URL.canParse_static", "canParse()")}} 静的メソッドを使って先に URL が有効かどうかをチェックしてください。
 
 ```js
 if (URL.canParse("../cats", "http://www.example.com/dogs")) {
@@ -131,5 +130,4 @@ const response = await fetch(
 - [`URL` のポリフィル (`core-js`)](https://github.com/zloirock/core-js#url-and-urlsearchparams)
 - [URL API](/ja/docs/Web/API/URL_API)
 - [URL とは何か](/ja/docs/Learn/Common_questions/Web_mechanics/What_is_a_URL)
-- `URL` オブジェクトを取得するプロパティ: {{domxref("URL")}}
 - {{domxref("URLSearchParams")}}

From df5a6868a4081397652cd42675ec15f0c48d2249 Mon Sep 17 00:00:00 2001
From: Masahiro FUJIMOTO <mfujimot@gmail.com>
Date: Wed, 25 Sep 2024 00:32:04 +0900
Subject: [PATCH 24/43] =?UTF-8?q?2024/09/09=20=E6=99=82=E7=82=B9=E3=81=AE?=
 =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=9F=BA=E3=81=A5=E3=81=8D?=
 =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 files/ja/web/api/url/url/index.md | 40 +++++++++++++++++++------------
 1 file changed, 25 insertions(+), 15 deletions(-)

diff --git a/files/ja/web/api/url/url/index.md b/files/ja/web/api/url/url/index.md
index 3ee42f49422202..e2a967a8bc3778 100644
--- a/files/ja/web/api/url/url/index.md
+++ b/files/ja/web/api/url/url/index.md
@@ -3,17 +3,15 @@ title: "URL: URL() コンストラクター"
 short-title: URL()
 slug: Web/API/URL/URL
 l10n:
-  sourceCommit: 0c8a320b035cf625c1df67713a94ead2e7f3aec6
+  sourceCommit: 5a7fae1cc8df27d50c9365511a714f3c2fa4bfc1
 ---
 
-{{APIRef("URL API")}}
+{{APIRef("URL API")}} {{AvailableInWorkers}}
 
 **`URL()`** コンストラクターは、引数によって定義された URL を表す、新しく生成された {{domxref("URL")}} オブジェクトを返します。
 
 与えられたベース URL または結果の URL が有効な URL でない場合、JavaScript の {{jsxref("TypeError")}} 例外が発生します。
 
-{{AvailableInWorkers}}
-
 ## 構文
 
 ```js-nolint
@@ -24,26 +22,35 @@ new URL(url, base)
 ### 引数
 
 - `url`
-  - : 絶対または相対 URL を表す文字列または{{Glossary("stringifier", "文字列化")}}のあるその他のオブジェクト、例えば {{htmlelement("a")}} や {{htmlelement("area")}} 要素です。
-    `url` が相対 URL である場合、`base` は必須であり、ベース URL として使用されます。
-    `url` が絶対 URL である場合、指定された `base` は無視されます。
+  - : 文字列または{{Glossary("stringifier", "文字列化")}}のあるその他のオブジェクトで、絶対またはベース URL に対する相対参照を表します。
+    `url` が相対参照である場合、`base` は必須であり、最終的な URL を解決するために使用されます。
+    `url` が絶対 URL である場合、指定された `base` は結果の URL を作成するためには使用されません。
 - `base` {{optional_inline}}
-  - : `url` が相対 URL の場合に使用するベース URL を表す文字列です。
+
+  - : 文字列で、`url` が相対参照の場合に使用するベース URL を表します。
     指定されなかった場合、既定値は `undefined` です。
 
+    `base` を指定した場合、解決した URL は単に `url` と `base` を結合したものではありません。
+    親ディレクトリーおよびカレントディレクトリーへの相対参照は、`base` URL の最後のスラッシュまでのパス部分をカレントディレクトリーとした相対で解決されます。ただし、最後のスラッシュ以降は含まれません。
+    ルートへの相対参照は、ベースを原点とした相対で解決されます。
+    詳細については、[URL への相対参照の解決](/ja/docs/Web/API/URL_API/Resolving_relative_references)を参照してください。
+
 > [!NOTE]
-> 引数 `url` と `base` はそれぞれ、文字列を受け入れる他の Web API と同様に、渡された値から文字列化されます。
+> 引数 `url` と `base` はそれぞれ、渡された値を何でも、{{domxref("HTMLAnchorElement")}} や {{domxref("HTMLAreaElement")}} であっても文字列化します。これは、文字列を受け入れる他の Web API と同様です。
 > 具体的な例としては、既存の {{domxref("URL")}} オブジェクトをどちらの引数にも使用することができ、そのオブジェクトの {{domxref("URL.href", "href")}} プロパティに文字列化されます。
 
 ### 例外
 
-| 例外                    | 説明                                                                                            |
-| ----------------------- | ----------------------------------------------------------------------------------------------- |
-| {{jsxref("TypeError")}} | `url`（絶対 URL の場合）または `base` + `url`（相対 URL の場合）が、有効な URL ではありません。 |
+- {{jsxref("TypeError")}}
+  - : `url`（絶対 URL の場合）または `base` + `url`（相対 URL の場合）が、有効な URL ではない場合。
 
 ## 例
 
-```js
+コンストラクターを使用する例をいくつか示します。
+
+> **メモ:** [相対参照の URL への解決](/ja/docs/Web/API/URL_API/Resolving_relative_references)では、さまざまな `url` と `base` 値が最終的な絶対 URL に解決される方法を説明するさらなる例が提供されています。
+
+```js-nolint
 // ベース URL:
 let baseUrl = "https://developer.mozilla.org";
 
@@ -67,9 +74,11 @@ new URL("/ja/docs", A);
 
 new URL("/ja/docs", "https://developer.mozilla.org/fr-FR/toto");
 // => 'https://developer.mozilla.org/ja/docs'
+```
 
-// 無効な URL:
+こちらは無効な URL の例です。
 
+```js
 new URL("/ja/docs", "");
 // Raises a TypeError exception as '' is not a valid URL
 
@@ -104,5 +113,6 @@ new URL("//foo.com", "https://example.com");
 
 ## 関連項目
 
+- {{domxref("URL.parse_static", "URL.parse()")}}: 例外を発生しないこのコンストラクターの代用
 - [`URL` のポリフィル (`core-js`)](https://github.com/zloirock/core-js#url-and-urlsearchparams)
-- 所属しているインターフェース: {{domxref("URL")}}。
+- 所属しているインターフェイス: {{domxref("URL")}}

From 50fe03d0d0b79f18a921a0526629fc0574c83d5d Mon Sep 17 00:00:00 2001
From: Gahotx <53534938+Gahotx@users.noreply.github.com>
Date: Sun, 29 Sep 2024 19:20:45 +0800
Subject: [PATCH 25/43] [zh-cn]: create the translation of the SVG attribute
 `azimuth` (#23782)

---
 .../zh-cn/web/svg/attribute/azimuth/index.md  | 75 +++++++++++++++++++
 1 file changed, 75 insertions(+)
 create mode 100644 files/zh-cn/web/svg/attribute/azimuth/index.md

diff --git a/files/zh-cn/web/svg/attribute/azimuth/index.md b/files/zh-cn/web/svg/attribute/azimuth/index.md
new file mode 100644
index 00000000000000..9c8be37734cb29
--- /dev/null
+++ b/files/zh-cn/web/svg/attribute/azimuth/index.md
@@ -0,0 +1,75 @@
+---
+title: azimuth
+slug: Web/SVG/Attribute/azimuth
+l10n:
+  sourceCommit: b4f998244660723175f8e06b5d77f68cfb1d1f1a
+---
+
+{{SVGRef}}
+
+**`azimuth`** 属性指定了光源在 XY 平面上的方向角度（顺时针），以相对于 x 轴的度数为单位。
+
+你可以将此属性与以下 SVG 元素一起使用：
+
+- {{SVGElement("feDistantLight")}}
+
+## 示例
+
+```css hidden
+html,
+body,
+svg {
+  height: 100%;
+}
+```
+
+```html
+<svg viewBox="0 0 440 200" xmlns="http://www.w3.org/2000/svg">
+  <filter id="distantLight1">
+    <feDiffuseLighting>
+      <feDistantLight azimuth="0" />
+    </feDiffuseLighting>
+  </filter>
+  <filter id="distantLight2">
+    <feDiffuseLighting>
+      <feDistantLight azimuth="240" />
+    </feDiffuseLighting>
+  </filter>
+
+  <circle cx="100" cy="100" r="80" style="filter: url(#distantLight1);" />
+  <circle
+    cx="100"
+    cy="100"
+    r="80"
+    style="filter: url(#distantLight2); transform: translateX(240px);" />
+</svg>
+```
+
+{{EmbedLiveSample("示例", "420", "200")}}
+
+## 使用说明
+
+<table class="properties">
+  <tbody>
+    <tr>
+      <th scope="row">值</th>
+      <td>{{cssxref("number")}}</td>
+    </tr>
+    <tr>
+      <th scope="row">默认值</th>
+      <td>0</td>
+    </tr>
+    <tr>
+      <th scope="row">动画性</th>
+      <td>有</td>
+    </tr>
+  </tbody>
+</table>
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}

From 1c88e8cf2fcfd457900a409e1bb6cdbae967910a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EC=84=9C=EC=A7=84?= <1106laura@naver.com>
Date: Sun, 29 Sep 2024 20:46:35 +0900
Subject: [PATCH 26/43] [ko] sync battery status api (#23802)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* [ko] sync battery status api

* fix: MD047/single-trailing-newline Files should end with a single newline character

* fix: 안내서에 따른 용어 및 누락 내용 추가

---------

Co-authored-by: hochan222 <hochan049@gmail.com>
---
 files/ko/web/api/battery_status_api/index.md | 72 ++++++++++++++------
 1 file changed, 53 insertions(+), 19 deletions(-)

diff --git a/files/ko/web/api/battery_status_api/index.md b/files/ko/web/api/battery_status_api/index.md
index 1035888a4ab79f..b9b943d93e4b7d 100644
--- a/files/ko/web/api/battery_status_api/index.md
+++ b/files/ko/web/api/battery_status_api/index.md
@@ -1,38 +1,74 @@
 ---
 title: Battery Status API
 slug: Web/API/Battery_Status_API
+l10n:
+  sourceCommit: be8f7f155a48e11b30c240f8731afb1845f85378
 ---
 
-{{DefaultAPISidebar("Battery API")}}
+{{DefaultAPISidebar("Battery API")}}{{securecontext_header}}
 
 **Battery API** 만큼이나 자주 언급되는 **Battery Status API**는 시스템의 배터리 충전 상태에 대한 정보를 제공하고, 배터리 상태에 따라 발생하는 이벤트를 다룰 수 있도록 해 줍니다. 배터리가 얼마남지 않은 상황에서, 앱에서 배터리의 소모를 줄인다거나 배터리가 방전되기 전에 데이터를 저장하거나 하는 것들이 가능합니다.
 
-Battery Status API 는 {{domxref("window.navigator.battery")}} 를 제공 합니다. 이는 {{domxref("BatteryManager")}} 객체이며 배터리 상태를 감시하고 전달받아 처리할 수 있는 이벤트를 가지고 있습니다.
+> [!NOTE]
+> 이 API는 [Web Workers](/ko/docs/Web/API/Web_Workers_API) 에서 사용이 불가능합니다. ({{domxref("WorkerNavigator")}} 에 포함되어 있지 않음)
+
+## 인터페이스
+
+- {{domxref("BatteryManager")}}
+  - : 시스템의 배터리 충전 상태에 대한 정보를 제공합니다.
+
+### 다른 인터페이스로의 확장
+
+- {{domxref("Navigator.getBattery()")}}
+  - : {{DOMxRef("BatteryManager")}} 객체를 이행하는 {{JSxRef("Promise")}}를 리턴합니다.
 
 ## 예제
 
-아래 예제에서는 배터리가 충전중인 상태 (전원 케이블을 연결하여 충전 중인지) 와 배터리 수준의 변화를 감시합니다. 각각 {{domxref("BatteryManager.chargingchange_event", "chargingchange")}} 와 {{domxref("BatteryManager.levelchange_event", "levelchange")}} 이벤트가 발생하면 완료 됩니다.
+이 예제에서는 배터리가 충전중인 상태(전원 케이블을 연결하여 충전 중인지)와 배터리 잔량 및 타이밍의 변화를 모두 관찰합니다. 이 작업은 {{domxref("BatteryManager.chargingchange_event", "chargingchange")}}, {{domxref("BatteryManager.levelchange_event", "levelchange")}}, {{domxref("BatteryManager.chargingtimechange_event", "chargingtimechange")}}, {{domxref("BatteryManager.dischargingtimechange_event", "dischargingtimechange")}} 이벤트를 수신하는 방식으로 수행됩니다.
 
 ```js
-var battery =
-  navigator.battery || navigator.mozBattery || navigator.webkitBattery;
+navigator.getBattery().then((battery) => {
+  function updateAllBatteryInfo() {
+    updateChargeInfo();
+    updateLevelInfo();
+    updateChargingInfo();
+    updateDischargingInfo();
+  }
+  updateAllBatteryInfo();
 
-function updateBatteryStatus() {
-  console.log("Battery status: " + battery.level * 100 + " %");
+  battery.addEventListener("chargingchange", () => {
+    updateChargeInfo();
+  });
+  function updateChargeInfo() {
+    console.log(`Battery charging? ${battery.charging ? "Yes" : "No"}`);
+  }
+
+  battery.addEventListener("levelchange", () => {
+    updateLevelInfo();
+  });
+  function updateLevelInfo() {
+    console.log(`Battery level: ${battery.level * 100}%`);
+  }
 
-  if (battery.charging) {
-    console.log("Battery is charging");
+  battery.addEventListener("chargingtimechange", () => {
+    updateChargingInfo();
+  });
+  function updateChargingInfo() {
+    console.log(`Battery charging time: ${battery.chargingTime} seconds`);
   }
-}
 
-battery.addEventListener("chargingchange", updateBatteryStatus);
-battery.addEventListener("levelchange", updateBatteryStatus);
-updateBatteryStatus();
+  battery.addEventListener("dischargingtimechange", () => {
+    updateDischargingInfo();
+  });
+  function updateDischargingInfo() {
+    console.log(`Battery discharging time: ${battery.dischargingTime} seconds`);
+  }
+});
 ```
 
-명세서의 예제도 [**확인**](http://dev.w3.org/2009/dap/system-info/battery-status.html#introduction)해보세요.
+[명세서의 예시도](https://www.w3.org/TR/battery-status/#examples) 참조하세요.
 
-## 명세
+## 명세서
 
 {{Specifications}}
 
@@ -40,8 +76,6 @@ updateBatteryStatus();
 
 {{Compat}}
 
-## 더보기
+## 같이 보기
 
-- [Hacks blog post - Using the Battery API](http://hacks.mozilla.org/2012/02/using-the-battery-api-part-of-webapi/)
-- {{domxref("BatteryManager")}}
-- {{domxref("window.navigator.battery","navigator.battery")}}
+- [Hacks blog post - Using the Battery API](https://hacks.mozilla.org/2012/02/using-the-battery-api-part-of-webapi/)

From b1bab72af6ab0683bce7dd9a450a8ffa08b1e6f2 Mon Sep 17 00:00:00 2001
From: j <115390541+rosaceaee@users.noreply.github.com>
Date: Sun, 29 Sep 2024 20:55:49 +0900
Subject: [PATCH 27/43] =?UTF-8?q?[ko]=20api/htmlelement/tabindex=20?=
 =?UTF-8?q?=EC=8B=A0=EA=B7=9C=20=EB=B2=88=EC=97=AD=20(#23600)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* [ko] api/htmlelement/tabindex 신규 번역

* 린트에 맞추어 공백 제거

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/ko/web/api/htmlelement/tabIndex/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Tabindex 리뷰 내용 반영

* Update files/ko/web/api/htmlelement/tabIndex/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* fix: 잘못된 파일 경로 수정

Co-authored-by: rosaceaee <rosaceaee@users.noreply.github.com>

* fix: 잘못된 파일 경로 수정

Co-authored-by: rosaceaee <rosaceaee@users.noreply.github.com>

---------

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: hochan Lee <hochan049@gmail.com>
Co-authored-by: rosaceaee <rosaceaee@users.noreply.github.com>
---
 .../ko/web/api/htmlelement/tabindex/index.md  | 46 +++++++++++++++++++
 1 file changed, 46 insertions(+)
 create mode 100644 files/ko/web/api/htmlelement/tabindex/index.md

diff --git a/files/ko/web/api/htmlelement/tabindex/index.md b/files/ko/web/api/htmlelement/tabindex/index.md
new file mode 100644
index 00000000000000..3c1db6a1af5f95
--- /dev/null
+++ b/files/ko/web/api/htmlelement/tabindex/index.md
@@ -0,0 +1,46 @@
+---
+title: "HTMLElement: tabIndex 속성"
+slug: Web/API/HTMLElement/tabIndex
+l10n:
+  sourceCommit: a3d9f61a8990ba7b53bda9748d1f26a9e9810b18
+---
+
+{{APIRef("HTML DOM")}}
+
+**`tabIndex`** 는 현재 요소의 탭 순서를 나타내는 {{DOMxRef("HTMLElement")}} 인터페이스입니다.
+
+탭 순서는 다음과 같습니다.
+
+1. `tabIndex`가 양수인 요소인 경우.
+   동일한 `tabIndex`값을 가진 요소들은 나타나는 순서대로 탐색되어야 합니다.
+   탐색은 가장 낮은 `tabIndex`에서 가장 높은 `tabIndex`로 진행됩니다.
+2. `tabIndex` 속성을 지원하지 않거나 지원하면서 `tabIndex`를 `0`으로 지정한 요소들은 나타나는 순서대로 탐색됩니다.
+
+비활성화된 요소들은 탭 순서에 참여하지 않습니다.
+
+값은 순차적일 필요가 없으며, 특정 값으로 시작할 필요도 없습니다. 값은 음수일 수도 있지만, 각 브라우저는 매우 큰 값을 잘라냅니다.
+
+## 값
+
+정수
+
+## 예제
+
+```js
+const b1 = document.getElementById("button1");
+
+b1.tabIndex = 1;
+```
+
+## 명세서
+
+{{Specifications}}
+
+## 브라우저 호환성
+
+{{Compat}}
+
+## 같이 보기
+
+- [Accessibility of keyboard-navigable JavaScript widgets](/ko/docs/Web/Accessibility/Keyboard-navigable_JavaScript_widgets)
+- HTML 전역 특성 [`tabindex`](/ko/docs/Web/HTML/Global_attributes/tabindex)

From af8b675f1eb939f5bc0cf065c2693372557d8b2c Mon Sep 17 00:00:00 2001
From: ICE0208 <doky3307@naver.com>
Date: Sun, 29 Sep 2024 20:56:48 +0900
Subject: [PATCH 28/43] [ko] fix typo in comment (#23466)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fix a type

슬록 -> 슬롯
---
 files/ko/web/javascript/guide/indexed_collections/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/ko/web/javascript/guide/indexed_collections/index.md b/files/ko/web/javascript/guide/indexed_collections/index.md
index 438c7dd8d8566f..71a94155cd841a 100644
--- a/files/ko/web/javascript/guide/indexed_collections/index.md
+++ b/files/ko/web/javascript/guide/indexed_collections/index.md
@@ -559,7 +559,7 @@ const a = Array(5); // [ <5 empty items> ]
 // 배열 리터럴의 연속된 쉼표
 const b = [1, 2, , , 5]; // [ 1, 2, <2 empty items>, 5 ]
 
-// array.length보다 큰 인덱스의 슬록에 직접적으로 값 설정하기
+// array.length보다 큰 인덱스의 슬롯에 직접적으로 값 설정하기
 const c = [1, 2];
 c[4] = 5; // [ 1, 2, <2 empty items>, 5 ]
 

From 3c0c71678a5403ddd5dcf9a3ad62eb69980e1eba Mon Sep 17 00:00:00 2001
From: Vivi <givvemeee@gmail.com>
Date: Sun, 29 Sep 2024 21:29:53 +0900
Subject: [PATCH 29/43] =?UTF-8?q?[ko]=20logical=20properties=20-=20basic?=
 =?UTF-8?q?=20concepts=20=EC=8B=A0=EA=B7=9C=20=EB=B2=88=EC=97=AD=20(#21745?=
 =?UTF-8?q?)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: [ko] logical properties - basic concepts 신규 번역

* Update files/ko/web/css/css_logical_properties_and_values/basic_concepts_of_logical_properties_and_values/index.md

Co-authored-by: sunny <sunhpark42@gmail.com>

* [fix] smoother sentence

* [fix] 이미지 파일 삭제

* fix: words

---------

Co-authored-by: sunny <sunhpark42@gmail.com>
---
 .../index.md                                  | 55 +++++++++++++++++++
 1 file changed, 55 insertions(+)
 create mode 100644 files/ko/web/css/css_logical_properties_and_values/basic_concepts_of_logical_properties_and_values/index.md

diff --git a/files/ko/web/css/css_logical_properties_and_values/basic_concepts_of_logical_properties_and_values/index.md b/files/ko/web/css/css_logical_properties_and_values/basic_concepts_of_logical_properties_and_values/index.md
new file mode 100644
index 00000000000000..6c50778fae1b05
--- /dev/null
+++ b/files/ko/web/css/css_logical_properties_and_values/basic_concepts_of_logical_properties_and_values/index.md
@@ -0,0 +1,55 @@
+---
+title: 논리적 속성과 값의 기본 개념
+slug: Web/CSS/CSS_logical_properties_and_values/Basic_concepts_of_logical_properties_and_values
+l10n:
+  sourceCommit: a08c1d8b4022ffbd69d4fd3097d0a30716f5fde7
+---
+
+{{CSSRef}}
+
+[CSS 논리적 속성과 값 모듈](/ko/docs/Web/CSS/CSS_logical_properties_and_values#properties) 은 CSS 에서의 {{glossary("physical properties")}} 의 대열 상대적인 매핑과 값을 정의합니다. 이 안내서에서는 모듈에 대해 다루며, {{glossary("flow relative values")}} 값과 속성에 대해 설명합니다.
+
+## 논리적 속성이 유용한 이유
+
+CSS 2.1과 이전 버전에서는 화면의 물리적 크기를 따라 요소의 크기를 설정해왔습니다. 그렇기 떄문에 박스를 {{CSSxRef("width")}} 와 {{CSSxRef("height")}} 로 표현했고, 아이템은 `top` 과 `left` 에서부터 위치시키고, 테두리, 바깥 여백, 그리고 안쪽 여백을 `top`, `right`, `bottom`, `left` 등에 할당했습니다. 논리적 속성과 값 모듈은 이러한 {{glossary("physical properties")}} 와 값을 논리적이거나 흐름 상대적인 값에 매핑합니다. 예로 `left`와 `right`, `top` 과 `bottom` 대신에 `start`와 `end`를 이용합니다.
+
+이러한 매핑은 원래의 레이아웃과 다른 쓰기 모드의 언어로 번역되는 사이트에서 매우 유용합니다. 예를 들어, CSS 그리드 레이아웃에서는, 만일 그리드 컨테이너가 그리드 요소들을 정렬하기 위해 {{CSSxRef("align-self")}} 와 {{CSSxRef("justify-self")}} 속성이 적용된 너비를 가지고 있을 때, 이 속성은 대열 상대적이기 때문에 `justify-self: start` 는 요소를 인라인 차원의 시작 지점에 요소들을 정렬하고, `align-self: start` 는 블록 차원에서의 시작 지점에 요소들을 정렬합니다.
+
+![가로 쓰기 모드에서의 그리드](grid-horizontal-width-sm.png)
+
+만일 컴포넌트의 쓰기 모드가 {{CSSxRef("writing-mode")}} 속성을 사용하여 `vertical-rl` 로 변경될 때, 정렬은 여전히 같은 방식으로 동작합니다. 인라인 차원은 세로로 동작하며, 블록 차원은 가로로 동작합니다. 그러나 그리드가 동일하게 보이지는 않는데, 이는 컨테이너에 지정된 너비는 가로로 측정되었으며, 이 측정은 텍스트의 논리나 상대 대열이 아닌 물리적인 측정이기 때문입니다.
+
+![세로 쓰기 모드에서의 그리드](grid-vertical-width-sm.png)
+
+`width` 속성을 사용하는 대신 논리적 속성인 {{CSSxRef("inline-size")}} 가 사용되었다면, 쓰기 모드에 관계 없이 컴포넌트가 동일한 방식으로 작동합니다.
+
+![세로 쓰기 모드에서의 그리드 레이아웃](grid-vertical-inline-size-small.png)
+
+아래의 실제 예제를 이용하여 시연해 볼 수 있습니다. `grid` 의 `writing-mode` 를 `vertical-rl` 에서 `horizontal-tb` 로 변경하여 다른 속성들이 레이아웃을 어떻게 변화시키는지 확인해 보세요.
+
+{{EmbedGHLiveSample("css-examples/logical/intro-grid-example.html", '100%', 700)}}
+
+창의적인 이유로 가로 방향이 아닌 위에서 아래 방향의 쓰기 모드를 사용할 때 콘텐츠의 대열을 연관지을 수 있다는 것은 매우 중요한 일입니다.
+
+## 블록과 인라인 차원
+
+대열 상대적인 속성과 값의 핵심 개념은 블록과 인라인 두 개의 차원입니다. 플렉스박스와 그리드 레이아웃과 같은 CSS 레이아웃 메서드는 요소를 정렬하기 위해 `right` 및 `left`/`top` 및 `bottom` 를 대신하여 `block` 과 `inline` 개념을 사용합니다.
+
+`inline` 차원은 현재 사용 중인 쓰기 모드에서 텍스트가 따르는 차원입니다. 즉, 텍스트가 왼쪽에서 오른쪽의 가로 방향을 따르는 영어 문서나 텍스트가 오른쪽에서 왼쪽의 가로 방향을 따라는 아랍어 문서에서 인라인 차원은 수평입니다. 세로 쓰기 모드 (예시. 일어 문서) 로 전환되면 해당 쓰기 모드에서는 줄이 세로를 따르므로 인라인 차원은 수직이 됩니다.
+
+블록 차원은 다른 차원이고, 단락과 같은 블록 방향에서는 하나의 요소가 다른 요소 뒤에 배치됩니다. 영어나 아랍어 문서에서는 이들이 세로 방향을 따르고, 세로 쓰기 모드에서는 가로로 표시됩니다.
+
+아래 도표는 가로 쓰기 모드에서의 인라인과 블록 방향을 나타냅니다.
+
+![인라인 축이 가로로, 블록 축이 세로로 실행되는 것을 나타내는 도표](mdn-horizontal.png)
+
+아래 도표는 세로 쓰기 모드에서의 인라인과 블록 방향을 나타냅니다.
+
+![블록 축이 가로로, 인라인 축이 세로로 실행되는 것을 나타내는 도표](mdn-vertical.png)
+
+## 같이 보기
+
+- [그리드 레이아웃에서의 박스 정렬](/ko/docs/Web/CSS/CSS_grid_layout/Box_alignment_in_grid_layout)
+- [플렉스 레이아웃에서의 박스 정렬](/ko/docs/Web/CSS/CSS_box_alignment/Box_alignment_in_flexbox)
+- [대열 레이아웃과 쓰기 모드](/ko/docs/Web/CSS/CSS_flow_layout/Flow_layout_and_writing_modes)
+- Smashing Magazine (2018)의 [논리적 속성과 값 이해하기](https://www.smashingmagazine.com/2018/03/understanding-logical-properties-values/)

From dbe1e76e0aaf0ee5023babd981d7b42831e00590 Mon Sep 17 00:00:00 2001
From: Vivi <givvemeee@gmail.com>
Date: Sun, 29 Sep 2024 21:37:03 +0900
Subject: [PATCH 30/43] =?UTF-8?q?[ko]=20using=20css=20counters=20=EC=B5=9C?=
 =?UTF-8?q?=EC=8B=A0=ED=99=94=20(#22085)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: [ko] using css counters 최신화

* [fix] 이미지 제거 및 단어 수정
---
 .../using_css_counters/index.md               | 211 +++++++++++++++---
 1 file changed, 184 insertions(+), 27 deletions(-)

diff --git a/files/ko/web/css/css_counter_styles/using_css_counters/index.md b/files/ko/web/css/css_counter_styles/using_css_counters/index.md
index 54c6ede2189fea..05390bd39c64c2 100644
--- a/files/ko/web/css/css_counter_styles/using_css_counters/index.md
+++ b/files/ko/web/css/css_counter_styles/using_css_counters/index.md
@@ -1,59 +1,213 @@
 ---
 title: CSS 카운터 사용하기
 slug: Web/CSS/CSS_counter_styles/Using_CSS_counters
+l10n:
+  sourceCommit: f75fd658f627b5730a14ada901120cfa4ee01bda
 ---
 
 {{CSSRef}}
 
-**CSS counters**를 사용하면 문서에서의 위치에 따라 콘텐츠의 모양을 조정할 수 있습니다. 예를 들어, counters를 사용해 웹페이지의 제목에 자동으로 번호를 매길 수 있습니다. Counters는 요소가 몇 번이나 사용되었는지 추적하여 CSS 규칙에 따라 증가하며, 본질적으로 변수입니다.
+**CSS counters**를 사용하면 문서에서의 위치에 따라 콘텐츠의 모양을 조정할 수 있습니다. 예를 들어, 카운터를 사용해 웹페이지의 제목에 자동으로 번호를 매기거나 순서가 있는 목록의 서수를 변경할 수 있습니다.
+
+카운터는 요소가 몇 번이나 사용되었는지 추적하여 CSS 규칙에 따라 증가하거나 감소하며, 본질적으로 변수입니다.
+카운터에 사용자 지정 이름을 적용할 수 있고, 모든 순서가 있는 목록에 대해 기본적으로 생성되는 `list-item` 카운터도 조작할 수 있습니다.
 
 ## Counters 사용하기
 
+CSS 카운터를 사용하려면 먼저 {{cssxref("counter-reset")}} 속성을 사용하여 초기화 해야합니다. 카운터의 값은 {{cssxref("counter-increment")}} 속성을 이용하여 증가하거나 감소시킬 수 있습니다. 카운터의 현재 값은 {{cssxref("counter", "counter()")}} 혹은 {{cssxref("counters", "counters()")}} 함수로 표시되는데, 일반적으로 [가상 요소](/ko/docs/Web/CSS/Pseudo-elements)인 {{CSSxRef("content")}} 속성 내에서 쓰입니다.
+
+카운터는 박스를 생성하는 요소에 대해서만 설정, 재설정, 혹은 증가시킬 수 있습니다.
+예를 들어, 요소에 `display: none` 가 설정되어 있다면, 해당 요소에서 적용되는 카운터는 모두 무시됩니다.
+
+카운터의 속성은 {{cssxref("contain")}} 속성에 상세하게 설명된 스타일 격리를 사용하여 특정 요소 내에서 범위를 지정할 수 있습니다.
+
 ### 카운터 값 조작하기
 
-CSS counter를 사용하려면 먼저 {{cssxref("counter-reset")}} 속성(초깃값 `0`)을 사용하여 초기화 해야합니다. 동일한 속성으로 값을 특정 값으로 바꿀 수도 있습니다. 초기화 된 counter의 값은 {{cssxref("counter-increment")}}에 따라 증가하거나 감소합니다. counter의 이름으로 "none", "inherit", "initial"은 사용불가합니다. 이런 이름을 사용하면 선언은 무시됩니다.
+CSS 카운터를 사용하려면 먼저 {{cssxref("counter-reset")}} 속성을 사용하여 초기화 해야합니다.
+이 속성은 카운터의 값을 아무 숫자로 변경하는 데에 사용됩니다.
+
+아래 예제에서는 `section` 이라고 명명된 카운터를 기본값 (0)으로 초기화합니다.
+
+```css
+counter-reset: section;
+```
+
+각각에 대해 초기값을 특정한다면 여러 개의 카운터를 초기화할 수도 있습니다.
+아래 예제에서는 `section` 과 `topic` 카운터를 기본값으로 초기화하고, `page` 카운터는 3으로 설정합니다.
+
+```css
+counter-reset: section page 3 topic;
+```
+
+한번 초기화가 되면 카운터의 값은 {{cssxref("counter-increment")}} 을 사용하여 증가하거나 감소시킬 수 있습니다.
+예를 들어, 아래 선언에서는 모든 `h3` 태그에 대해 `section` 카운터를 하나씩 증가시킵니다.
+
+```css
+h3::before {
+  counter-increment: section; /* section 카운터를 1씩 증가 */
+}
+```
+
+카운터의 이름 뒤에 양수나 음수를 사용함으로써증가하거나 감소시킬 값을 설정할 수 있습니다.
+
+카운터의 이름으로 `none`, `inherit`, 또는 `initial` 는 사용 불가하고, 이런 이름을 사용하면 선언은 무시됩니다.
 
 ### 카운터 표시하기
 
-Counter의 값은 {{cssxref("content")}} 속성에서 {{cssxref("counter()")}}나 {{cssxref("counters()")}} 함수를 사용하여 표시할 수 있습니다.
+카운터의 값은 {{cssxref("content")}} 속성에서 {{cssxref("counter()")}}나 {{cssxref("counters()")}} 함수를 사용하여 표시할 수 있습니다.
+
+예를 들어, 다음 선언에서는 `counter()` 를 사용하여 각각의 `h3` 제목 앞에 `Section <number>:` 라는 텍스트를 추가하고, 여기서의 `<number>` 는 십진수로 카운트된 값입니다. (기본으로 표시되는 스타일)
+
+```css
+h3::before {
+  counter-increment: section; /* section 카운터를 1씩 증가 */
+  content: "Section " counter(section) ": "; /* 기본 스타일(십진수)로 카운터 값 표시 */
+}
+```
+
+{{cssxref("counter", "counter()")}} 함수는 중첩된 단계의 번호 매기기가 부모 단계의 맥락을 포함하지 않을 때에 사용됩니다.
+여기 각각의 중첩 단계가 1부터 시작하는 예제가 있습니다.
+
+```plain
+1 One
+  1 Nested one
+  2 Nested two
+2 Two
+  1 Nested one
+  2 Nested two
+  3 Nested three
+3 Three
+```
+
+{{cssxref("counters", "counters()")}} 함수는 중첩된 단계의 카운트가 부모 단계의 카운트를 포함해야 할 때 사용됩니다.
+예를 들어, 다음과 같이 섹션을 레이아웃하는 데에 사용할 수 있습니다.
+
+```plain
+1 One
+  1.1 Nested one
+  1.2 Nested two
+2 Two
+  2.1 Nested one
+  2.2 Nested two
+  2.3 Nested three
+3 Three
+```
+
+{{cssxref("counter", "counter()")}} 함수는 `counter(<counter-name>)` 와 `counter(<counter-name>, <counter-style>)` 처럼 두 가지 형태로 사용될 수 있습니다.
+생성된 텍스트는 의사 요소의 범위 내에서 주어진 이름의 가장 안쪽의 카운터 값입니다.
+
+{{cssxref("counters", "counters()")}} 함수 또한 두 가지 형태를 가지는데, `counters(<counter-name>, <separator>)` 와 `counters(<counter-name>, <separator>, <counter-style>)` 입니다.
+생성된 텍스트는 의사 요소의 범위 내에서 주어진 이름의 모든 카운터 값이고, 가장 바깥쪽부터 가장 안쪽까지를 문자열 (`<separator>`)를 사용하여 분리합니다.
+
+카운터는 두 가지 방법 모두에서 지정된 `<counter-style>` 로 렌더링됩니다. (기본값은 `decimal`)
+{{cssxref("list-style-type")}} 값들을 사용하거나 사용자 지정의 [맞춤 스타일](/ko/docs/Web/CSS/CSS_counter_styles)을 사용할 수도 있습니다.
+
+`counter()` 와 `counters()` 의 사용에 대한 예제는 아래 [기본 예제](#기본_예제) 그리고 [중첩 카운터 예제](#중첩_카운터_예제)에서 확인할 수 있습니다.
+
+### 역순 카운터
+
+역순 카운터는 증가가 아닌 감소를 목적으로 하는 카운터입니다.
+역순 카운터는 {{cssxref("counter-reset")}} 에서 카운터의 이름을 지정할 때 `reversed()` 함수 표기를 사용하여 생성할 수 있습니다.
+
+역순 카운터는 기본 초기값을 가지고 있는데, 이는 요소의 수와 동일합니다. (기본값이 0인 일반적인 카운터와는 다릅니다.)
+이는 요소의 수에서 하나까지 감소시키는 카운터의 구현을 더 쉽게 만듭니다.
 
-`counter()` 함수는 'counter(name)'와 'counter(name, style)' 두 가지 형태로 사용할 수 있습니다. 생성된 텍스트는 가상 요소가 속한 범위에 있는 이름(name)의 가장 안쪽 counter의 값입니다. 텍스트는 지정된 서식(기본값은 십진수`decimal`)으로 뿌려집니다.
+예를 들어, `section` 이라는 이름의 역순 카운터를 기본 초기값으로 생성하기 위해서는 아래 문법처럼 작성할 수 있습니다.
 
-`counters()` 함수도 'counters(name, string)'나 'counters(name, string, style)' 두 가지 형태로 사용할 수 있습니다. 생성된 텍스트는 가상 요소가 속한 모든 범위에서 지정된 이름을 가진 counters의 값으로, 바깥 쪽부터 안쪽까지 값이 주어지며 지정된 문자열로 구분됩니다. counters는 지정된 스타일(기본값은 십진수`decimal`)로 렌더링 됩니다.
+```css
+counter-reset: reversed(section);
+```
+
+물론 원하는 초기값을 지정할 수도 있습니다.
+
+카운터의 값은 {{cssxref("counter-increment")}} 의 음수값을 특정함에 따라 감소하게 됩니다.
+
+> **참고:** {{cssxref("counter-increment")}} 를 사용하여 역순이 아닌 카운터를 감소시킬 수 있습니다.
+> 역순 카운터의 주요 이점은 기본 초기값이며,`list-item` 카운터가 역순 카운터를 자동으로 감소시킨다는 점입니다.
+
+### 목록 요소의 카운터
+
+{{HTMLElement("ol")}} 요소로 생성된 것과 같은 순서가 있는 목록에서, 카운터는 암묵적으로 `list-item` 라는 이름을 갖습니다.
+
+다른 카운터들처럼 이 또한 0의 기본 초기값을 가지게 되는데, "요소의 숫자" 역시 역순 카운터의 초기값으로 쓰입니다.
+사용자가 지정한 카운터가 아니라면 `list-item` 은 카운터가 역순인지 아닌지 여부에 따라 자동적으로 각각의 요소에 대하여 1씩 증가하거나 감소하게 됩니다.
+
+`list-item` 카운터는 CSS 를 사용한 순서가 있는 목록의 기본 동작을 조작할 수도 있습니다.
+예를 들어 기본 초기값을 변경하거나, {{cssxref("counter-increment")}} 를 사용하여 목록 요소가 증가하거나 감소되는 것을 변경할 수 있습니다.
+
+## 예제
 
 ### 기본 예제
 
-여기서는 제목 앞에 숫자를 붙여봅니다.
+이 예제는 각 제목의 시작 부분에 "Section \[카운터 값]:"을 추가합니다.
 
 #### CSS
 
 ```css
 body {
-  counter-reset: section; /* counter 이름을 'section'으로 지정합니다.
-                                                   초깃값은 0입니다. */
+  counter-reset: section; /* 카운터의 이름을 'section' 으로 지정하며, 초기값은 0이 됩니다. */
 }
 
 h3::before {
-  counter-increment: section; /* section의 카운터 값을 1씩 증가시킵니다. */
-  content: "Section " counter(section) ": "; /* section의 카운터 값을 표시합니다. */
+  counter-increment: section; /* section 카운터를 1씩 증가 */
+  content: "Section " counter(section) ": "; /* 'Section ' 단어를 표시하고,
+                                                각 h3의 내용 앞에 섹션 카운터 값과
+                                                콜론을 추가합니다. */
 }
 ```
 
 #### HTML
 
 ```html
-<h3>Introduction</h3>
-<h3>Body</h3>
-<h3>Conclusion</h3>
+<h3>도입</h3>
+<h3>본문</h3>
+<h3>결론</h3>
 ```
 
 #### 결과
 
 {{EmbedLiveSample("Basic_example", "100%", 150)}}
 
-### 더 정교한 예시
+### 기본 예제: 역순 카운터
 
-카운터가 증가 할 때마다 반드시 표시되어야 하는 것은 아닙니다. 이 예시는 모든 링크를 계산하지만 카운터는 링크에 텍스트가 없는 경우에만 표시되므로 편리한 대체제입니다.
+이 예제는 위에서 본 예제와 동일하지만, 역순 카운터를 사용한다는 점만 다릅니다.
+만일 브라우저가 `reversed()` 함수 표기법을 지원한다면, 결과는 아래와 같이 보일 것입니다.
+
+![역순 카운터](reversed_headings_basic.png)
+
+#### CSS
+
+```css
+body {
+  counter-reset: reversed(
+    section
+  ); /* 카운터의 이름을 'section' 으로 지정하며, 초기값은 0이 됩니다. */
+}
+
+h3::before {
+  counter-increment: section -1; /* section 카운터를 1씩 감소 */
+  content: "Section " counter(section) ": "; /* 'Section ' 단어를 표시하고,
+                                                각 h3의 내용 앞에 섹션 카운터 값과
+                                                콜론을 추가합니다. */
+}
+```
+
+#### HTML
+
+```html
+<h3>도입</h3>
+<h3>본문</h3>
+<h3>결론</h3>
+```
+
+#### 결과
+
+{{EmbedLiveSample("Basic example: reversed counter", "100%", 150)}}
+
+### 더 정교한 예제
+
+카운터는 증가할 때마다 반드시 표시될 필요는 없습니다.
+이 예제는 모든 링크를 세면서, 링크에 텍스트가 없을 때만 카운터를 표시하여 편리한 대체 방법으로 사용합니다.
 
 #### CSS
 
@@ -74,21 +228,20 @@ a[href]:empty::after {
 #### HTML
 
 ```html
-<p>See <a href="https://www.mozilla.org/"></a></p>
-<p>Do not forget to <a href="contact-me.html">leave a message</a>!</p>
-<p>See also <a href="https://developer.mozilla.org/"></a></p>
+<p>보기 <a href="https://www.mozilla.org/"></a></p>
+<p><a href="contact-me.html">메시지를 남기는 것을</a> 잊지 마세요!</p>
+<p>같이 보기 <a href="https://developer.mozilla.org/"></a></p>
 ```
 
-#### Result
+#### 결과
 
 {{EmbedLiveSample("A_more_sophisticated_example", "100%", 150)}}
 
-## 중첩 카운터
-
-CSS 카운터는 자식 요소 안에서 새 인스턴스를 자동으로 만들어주어 목차를 만드는데 유용합니다. {{cssxref("counters()")}} 함수를 사용해 중첩된 다른 레벨의 카운터 사이를 분리하는 글자를 지정할 수 있습니다.
-
 ### 중첩 카운터 예제
 
+CSS 카운터는 자식 요소 안에서 새 인스턴스를 자동으로 만들어주어 목차를 만드는데 유용합니다.
+{{cssxref("counters", "counters()")}} 함수를 사용해 중첩된 다른 레벨의 카운터 사이를 분리하는 글자를 지정할 수 있습니다.
+
 #### CSS
 
 ```css
@@ -123,9 +276,9 @@ li::before {
           <li>item</li>  <!-- 2.3.2 -->
         </ol>
         <ol>
-          <li>item</li>  <!-- 2.4.1 -->
-          <li>item</li>  <!-- 2.4.2 -->
-          <li>item</li>  <!-- 2.4.3 -->
+          <li>item</li>  <!-- 2.3.1 -->
+          <li>item</li>  <!-- 2.3.2 -->
+          <li>item</li>  <!-- 2.3.3 -->
         </ol>
       </li>
       <li>item</li>      <!-- 2.4   -->
@@ -148,8 +301,12 @@ li::before {
 
 {{Specifications}}
 
-## See also
+## 같이 보기
 
+- {{cssxref("contain")}}
 - {{cssxref("counter-reset")}}
+- {{cssxref("counter-set")}}
 - {{cssxref("counter-increment")}}
 - {{cssxref("@counter-style")}}
+- [CSS 카운터 스타일](/ko/docs/Web/CSS/CSS_counter_styles) 모듈
+- [CSS 목록과 카운터](/ko/docs/Web/CSS/CSS_lists) 모듈

From b73e329cd4cbaa8b6f7e2f88fb6c54d52dd8f9f3 Mon Sep 17 00:00:00 2001
From: Chanmin <kimchanmin1@gmail.com>
Date: Sun, 29 Sep 2024 21:46:35 +0900
Subject: [PATCH 31/43] docs(ko): Add Korean translation of fit-content
 (#23514)

* docs(ko): add korean translation of fit-content

* chore: translate code example

* fix: fix EmbedLiveSample

* chore: fix awkward translation

* chore: fix awkward translation

* chore: fix awkward translation

* Update files/ko/web/css/fit-content/index.md

* Update files/ko/web/css/fit-content/index.md

---------

Co-authored-by: hochan Lee <hochan049@gmail.com>
---
 files/ko/web/css/fit-content/index.md | 73 +++++++++++++++++++++++++++
 1 file changed, 73 insertions(+)
 create mode 100644 files/ko/web/css/fit-content/index.md

diff --git a/files/ko/web/css/fit-content/index.md b/files/ko/web/css/fit-content/index.md
new file mode 100644
index 00000000000000..e607b1374b2d9b
--- /dev/null
+++ b/files/ko/web/css/fit-content/index.md
@@ -0,0 +1,73 @@
+---
+title: fit-content
+slug: Web/CSS/fit-content
+l10n:
+  sourceCommit: 14515827c44f3cb814261a1c6bd487ae8bfcde1b
+---
+
+{{CSSRef}}
+
+**`fit-content`** 키워드는 {{cssxref("fit-content_function", "fit-content(stretch)")}}와 동일합니다. 실제로 이는 박스가 사용 가능한 공간을 사용하되, 절대 {{cssxref("max-content")}}보다 크지는 않음을 의미합니다.
+
+{{cssxref("width")}}, {{cssxref("height")}}, {{cssxref("min-width")}}, {{cssxref("min-height")}}, {{cssxref("max-width")}} 및 {{cssxref("max-height")}} 가 레이아웃된 박스의 크기로 사용된 경우, 최대 크기와 최소 크기는 콘텐츠의 크기를 참조합니다.
+
+> [!NOTE]
+> CSS Sizing 명세는 {{cssxref("fit-content_function", "fit-content()")}} 함수도 정의합니다. 이 페이지에서는 해당 키워드에 대해 설명합니다.
+
+## 구문
+
+```css
+width: fit-content;
+block-size: fit-content;
+```
+
+## 예제
+
+### fit-content를 사용해 박스 크기 설정하기
+
+#### HTML
+
+```html
+<div class="container">
+  <div class="item">항목</div>
+  <div class="item">더 많은 텍스트가 포함된 항목입니다.</div>
+  <div class="item">
+    텍스트가 더 많이 포함된 항목입니다. 텍스트가 줄바꿈되기를 기대하며 충분한
+    양의 텍스트를 추가했습니다.
+  </div>
+</div>
+```
+
+#### CSS
+
+```css
+.container {
+  border: 2px solid #ccc;
+  padding: 10px;
+  width: 20em;
+}
+
+.item {
+  width: fit-content;
+  background-color: #8ca0ff;
+  padding: 5px;
+  margin-bottom: 1em;
+}
+```
+
+#### 결과
+
+{{EmbedLiveSample("fit-content를 사용해 박스 크기 설정하기", "100%", 200)}}
+
+## 명세서
+
+{{Specifications}}
+
+## 브라우저 호환성
+
+{{Compat}}
+
+## 같이 보기
+
+- 연관된 크기 설정 키워드: {{cssxref("min-content")}}, {{cssxref("max-content")}}
+- [CSS box sizing](/ko/docs/Web/CSS/CSS_box_sizing) 모듈

From a597efc3653d84debeb02e8bc910d9d7307af5fb Mon Sep 17 00:00:00 2001
From: Jongha Kim <kim.jongha@gmail.com>
Date: Sun, 29 Sep 2024 21:46:46 +0900
Subject: [PATCH 32/43] =?UTF-8?q?[ko]=20RegExp.prototype.unicodeSets=20?=
 =?UTF-8?q?=EC=8B=A0=EA=B7=9C=20=EB=B2=88=EC=97=AD=20=EC=99=B8=20(#22898)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* [ko] RegExp.prototype.unicodeSets 신규 번역 외

- RegExp.prototype.unicodeSets 신규 번역
- String.prototype.at() 최신화

* 린트 에러 수정
---
 .../regexp/unicodesets/index.md               | 55 +++++++++++++++++++
 .../global_objects/string/at/index.md         | 16 +++---
 2 files changed, 64 insertions(+), 7 deletions(-)
 create mode 100644 files/ko/web/javascript/reference/global_objects/regexp/unicodesets/index.md

diff --git a/files/ko/web/javascript/reference/global_objects/regexp/unicodesets/index.md b/files/ko/web/javascript/reference/global_objects/regexp/unicodesets/index.md
new file mode 100644
index 00000000000000..c858de8b3b00f5
--- /dev/null
+++ b/files/ko/web/javascript/reference/global_objects/regexp/unicodesets/index.md
@@ -0,0 +1,55 @@
+---
+title: RegExp.prototype.unicodeSets
+slug: Web/JavaScript/Reference/Global_Objects/RegExp/unicodeSets
+l10n:
+  sourceCommit: 8421c0cd94fa5aa237c833ac6d24885edbc7d721
+---
+
+{{JSRef}}
+
+**`unicodeSets`** 접근자 속성은 {{jsxref("RegExp")}} 인스턴스의 속성으로, 이 정규 표현식에 `v` 플래그가 사용되었는지 여부를 반환합니다.
+
+## 설명
+
+`RegExp.prototype.unicodeSets`는 `v` 플래그가 사용된 경우 `true` 값을 가지며, 그렇지 않으면 `false`입니다. `v` 플래그는 [`u`](/ko/docs/Web/JavaScript/Reference/Global_Objects/RegExp/unicode) 플래그의 업그레이드 버전으로, 더 많은 유니코드 관련 기능을 활성화합니다. ("v"는 알파벳에서 "u" 다음 글자입니다.) `u`와 `v`는 동일한 정규식을 호환되지 않는 방식으로 해석하기 때문에, 두 플래그를 모두 사용하면 {{jsxref("SyntaxError")}}가 발생합니다. `v` 플래그를 사용하면 `u` 플래그 설명에 언급된 모든 기능과 함께 다음과 같은 추가 기능을 사용할 수 있습니다.
+
+- [`\p`](/ko/docs/Web/JavaScript/Reference/Regular_expressions/Unicode_character_class_escape) 이스케이프 시퀀스를 문자뿐만 아니라 문자열의 속성과도 일치시키는 데 사용할 수 있습니다.
+- [문자 클래스](/ko/docs/Web/JavaScript/Reference/Regular_expressions/Character_class) 구문이 업그레이드되어 교집합, 합집합, 차집합 구문을 허용하며, 여러 유니코드 문자와 일치시킬 수 있습니다.
+- 문자 클래스 보수 구문 `[^...]`은 일치 결과를 부정하는 대신 보수 클래스를 구성하여 대소문자 구분 없는 일치에서 일부 혼란스러운 동작을 피합니다. 자세한 내용은 [보수 클래스와 대소문자 구분 없는 일치](/ko/docs/Web/JavaScript/Reference/Regular_expressions/Character_class#complement_classes_and_case-insensitive_matching)를 참조하세요.
+
+`u` 모드에서 유효했던 일부 정규식은 `v` 모드에서 유효하지 않습니다. 특히 문자 클래스 구문이 다르고 일부 문자는 더 이상 문자 그대로 나타날 수 없습니다. 자세한 내용은 [`v` 모드 문자 클래스](/ko/docs/Web/JavaScript/Reference/Regular_expressions/Character_class#v-mode_character_class)를 참조하세요.
+
+> [!NOTE] > `v` 모드는 문자소를 단일 문자로 해석하지 않습니다. 여전히 다수의 코드 포인트입니다. 예를 들어, `/[🇺🇳]/v`는 여전히 `"🇺"`와 일치할 수 있습니다.
+
+`unicodeSets`의 설정자는 `undefined`입니다. 이 속성을 직접 변경할 수 없습니다.
+
+## 예제
+
+### unicodeSets 속성 사용하기
+
+```js
+const regex = /[\p{Script_Extensions=Greek}&&\p{Letter}]/v;
+
+console.log(regex.unicodeSets); // true
+```
+
+## 명세서
+
+{{Specifications}}
+
+## 브라우저 호환성
+
+{{Compat}}
+
+## 같이 보기
+
+- {{jsxref("RegExp.prototype.lastIndex")}}
+- {{jsxref("RegExp.prototype.dotAll")}}
+- {{jsxref("RegExp.prototype.global")}}
+- {{jsxref("RegExp.prototype.hasIndices")}}
+- {{jsxref("RegExp.prototype.ignoreCase")}}
+- {{jsxref("RegExp.prototype.multiline")}}
+- {{jsxref("RegExp.prototype.source")}}
+- {{jsxref("RegExp.prototype.sticky")}}
+- {{jsxref("RegExp.prototype.unicode")}}
+- [문자열의 표기법 및 속성을 설정하는 RegExp v 플래그](https://v8.dev/features/regexp-v-flag) - v8.dev (2022)
diff --git a/files/ko/web/javascript/reference/global_objects/string/at/index.md b/files/ko/web/javascript/reference/global_objects/string/at/index.md
index f9e503496fbb0e..6a98427da6e9c4 100644
--- a/files/ko/web/javascript/reference/global_objects/string/at/index.md
+++ b/files/ko/web/javascript/reference/global_objects/string/at/index.md
@@ -1,11 +1,13 @@
 ---
 title: String.prototype.at()
 slug: Web/JavaScript/Reference/Global_Objects/String/at
+l10n:
+  sourceCommit: c2445ce1dc3a0170e2fbfdbee10e18a7455c2282
 ---
 
 {{JSRef}}
 
-**`at()`** 메서드는 정수 값을 받아서 지정된 오프셋에 있는 단일 UTF-16 코드 단위로 구성된 새 {{jsxref('String')}}을 반환합니다. 이 방법은 양의 정수와 음의 정수를 허용합니다. 음의 정수는 문자열의 마지막부터 셉니다.
+{{jsxref("String")}} 값의 **`at()`** 메서드는 정수 값을 받아 지정된 오프셋에 위치한 단일 UTF-16 코드 유닛으로 구성된 새로운 {{jsxref("String")}}을 반환합니다. 이 메서드는 양의 정수와 음의 정수를 모두 허용합니다. 음의 정수는 문자열의 마지막 문자부터 거꾸로 세어 위치를 지정합니다.
 
 {{EmbedInteractiveExample("pages/js/string-at.html")}}
 
@@ -18,11 +20,11 @@ at(index)
 ### 매개변수
 
 - `index`
-  - : 문자열에서 반환할 문자의 인덱스(위치)입니다. 인덱스로 음수를 전달할 때 문자열의 끝에서 상대적인 색인을 지원합니다. 즉, 음수가 사용되면 반환할 문자는 문자열의 끝에서 역으로 계산하여 찾습니다.
+  - : 반환할 문자열 문자의 인덱스(위치)입니다. 음수 인덱스를 전달하면 문자열 끝에서부터의 상대적 인덱싱을 지원합니다. 즉, 음수가 사용되면 반환되는 문자는 문자열의 끝에서부터 거꾸로 세어 찾아집니다.
 
 ### 반환 값
 
-지정된 위치에 있는 단일 UTF-16 코드 단위로 구성된 새 {{jsxref('String')}}. 만약 주어진 인덱스를 찾을 수 없는 경우 {{jsxref('undefined')}}을 반환합니다.
+지정된 위치에 있는 단일 UTF-16 코드 유닛으로 구성된 {{jsxref("String")}}을 반환합니다. 주어진 인덱스를 찾을 수 없으면 {{jsxref("undefined")}}를 반환합니다.
 
 ## 예제
 
@@ -35,6 +37,7 @@ at(index)
 function returnLast(arr) {
   return arr.at(-1);
 }
+
 let invoiceRef = "myinvoice01";
 
 console.log(returnLast(invoiceRef)); // '1'
@@ -46,7 +49,7 @@ console.log(returnLast(invoiceRef)); // '2'
 
 ### 메서드 비교하기
 
-여기서 {{jsxref('String')}}의 끝에서 두 번째 문자를 선택하는 다양한 방법을 비교하겠습니다. 아래의 모든 방법이 유효하며, 싱대적으로 `at()`의 간결함과 가독성이 돋보입니다.
+여기서는 {{jsxref("String")}}의 끝에서 두 번째(마지막에서 하나 앞) 문자를 선택하는 다양한 방법을 비교합니다. 아래의 모든 방법이 유효하지만, 이는 `at()` 메서드의 간결성과 가독성을 강조합니다.
 
 ```js
 const myString = "Every green bus drives fast.";
@@ -64,7 +67,7 @@ const atWay = myString.at(-2);
 console.log(atWay); // 't'
 ```
 
-## 명세
+## 명세서
 
 {{Specifications}}
 
@@ -74,8 +77,7 @@ console.log(atWay); // 't'
 
 ## 같이 보기
 
-- [Polyfill of `String.prototype.at` in `core-js`](https://github.com/zloirock/core-js#ecmascript-string-and-regexp)
-- [A polyfill for the at() method](https://github.com/tc39/proposal-relative-indexing-method#polyfill).
+- [`core-js`에서의 `String.prototype.at` 폴리필](https://github.com/zloirock/core-js#ecmascript-string-and-regexp)
 - {{jsxref("String.prototype.indexOf()")}}
 - {{jsxref("String.prototype.lastIndexOf()")}}
 - {{jsxref("String.prototype.charCodeAt()")}}

From 25752cc097e68c9b1b097fd36aa7d11257749e23 Mon Sep 17 00:00:00 2001
From: Bang HoJin <132210541+banhogu@users.noreply.github.com>
Date: Sun, 29 Sep 2024 21:57:16 +0900
Subject: [PATCH 33/43] [ko] translate learn/common_questions (#23046)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ko_learn_common_questions 번역
---
 files/ko/learn/common_questions/index.md | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)
 create mode 100644 files/ko/learn/common_questions/index.md

diff --git a/files/ko/learn/common_questions/index.md b/files/ko/learn/common_questions/index.md
new file mode 100644
index 00000000000000..1159c1a56538a0
--- /dev/null
+++ b/files/ko/learn/common_questions/index.md
@@ -0,0 +1,17 @@
+---
+title: Common questions
+slug: Learn/Common_questions
+l10n:
+  sourceCommit: 751d58669499de0c6ea0d5b356e0e1448418c5d3
+---
+
+{{LearnSidebar}}
+
+해당 학습 영역의 섹션은 [HTML](/ko/docs/Learn/HTML)이나 [CSS](/ko/docs/Learn/CSS)와 같은 구조화된 핵심 학습 경로의 일부는 아니지만, 자주 묻는 질문에 대한 답변을 제공하기 위해 만들어졌습니다. 아래의 글들은 독립적으로 읽고 이해할 수 있도록 작성되었습니다.
+
+- [HTML 관련 질문](/ko/docs/Learn/HTML/Howto)
+- [CSS 관련 질문](/ko/docs/Learn/CSS/Howto)
+- [JavaScript 관련 질문](/ko/docs/Learn/JavaScript/Howto)
+- [웹 메커니즘](/ko/docs/Learn/Common_questions/Web_mechanics)
+- [도구 및 설정](/ko/docs/Learn/Common_questions/Tools_and_setup)
+- [디자인 및 접근성](/ko/docs/Learn/Common_questions/Design_and_accessibility)

From eeb4b62db383ad194f18bf82dd38636245cf2545 Mon Sep 17 00:00:00 2001
From: Vivi <givvemeee@gmail.com>
Date: Sun, 29 Sep 2024 22:03:39 +0900
Subject: [PATCH 34/43] =?UTF-8?q?[ko]=20=20css=20image=20set=20=EC=8B=A0?=
 =?UTF-8?q?=EA=B7=9C=20=EB=B2=88=EC=97=AD=20(#23318)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* [feat] ko css image set 신규 번역

* [fix] comment
---
 files/ko/web/css/image/image-set/index.md | 111 ++++++++++++++++++++++
 1 file changed, 111 insertions(+)
 create mode 100644 files/ko/web/css/image/image-set/index.md

diff --git a/files/ko/web/css/image/image-set/index.md b/files/ko/web/css/image/image-set/index.md
new file mode 100644
index 00000000000000..0cc3a6932f0c1d
--- /dev/null
+++ b/files/ko/web/css/image/image-set/index.md
@@ -0,0 +1,111 @@
+---
+title: image-set()
+slug: Web/CSS/image/image-set
+l10n:
+  sourceCommit: 14515827c44f3cb814261a1c6bd487ae8bfcde1b
+---
+
+{{CSSRef}}
+
+**`image-set()`** [CSS](/ko/docs/Web/CSS) [함수형](/ko/docs/Web/CSS/CSS_Functions) 표기법은 브라우저가 높은 해상도를 위해 주어진 이미지 집합 안에서 가장 적합한 CSS를 선택하도록 할 수 있는 방법입니다.
+
+해상도와 대역폭은 기기와 네트워크 접근에 따라 달라집니다. `image-set()` 함수는 가장 적합한 해상도의 이미지를 사용자의 기기로 전달하여 기기와 설정에 따른 적합한 이미지를 선택할 수 있도록 하는데, 이는 해상도와 이미지 옵션의 집합을 제공하고 각 이미지에는 해상도 정의도 연관되어 있습니다. 해상도는 파일 크기에 따라 프록시로도 사용될 수 있습니다. 느린 모바일 연결이지만 높은 해상도의 화면을 가진 사용자 에이전트는 고해상도 이미지의 로드를 기다리는 것보다 저해상도 이미지를 선호할 수도 있습니다.
+
+`image-set()` 은 각각의 사용자가 필요로 하는 것을 결정하기 보다는 선택할 수 있는 옵션을 제공합니다.
+
+## 구문
+
+```css-nolint
+/* 해상도를 기반으로 이미지 선택하기 */
+image-set(
+  "image1.jpg" 1x,
+  "image2.jpg" 2x
+);
+
+image-set(
+  url("image1.jpg") 1x,
+  url("image2.jpg") 2x
+);
+
+/* 해상도를 기반으로 그라디언트 선택하기 */
+image-set(
+  linear-gradient(blue, white) 1x,
+  linear-gradient(blue, green) 2x
+);
+
+/* 지원하는 확장자를 기반으로 이미지 선택하기 */
+image-set(
+  url("image1.avif") type("image/avif"),
+  url("image2.jpg") type("image/jpeg")
+);
+```
+
+### 값
+
+- `<image>`
+  - : [`<image>`](/ko/docs/Web/CSS/image) 태그는 이미지 집합을 제외하고서는 어떠한 이미지 타입도 될 수 있습니다. `image-set()` 함수는 다른 `image-set()` 함수 내에 중첩될 수 없습니다.
+- `<string>`
+  - : 이미지의 URL입니다.
+- `<resolution>` {{optional_inline}}
+  - : [`<resolution>`](/ko/docs/Web/CSS/resolution) 태그는 픽셀 당 도트 단위인 `x` 혹은 `dppx` 를 포함하여 인치 당 도트 단위인 `dpi`, 센티미터 당 도트 단위인 `dpcm` 등 단위를 나타냅니다. `image-set()` 내의 모든 이미지는 고유한 해상도를 가져야 합니다.
+- `type(<string>)` {{optional_inline}}
+  - : "image/jpeg" 와 같은 유효한 MIME 타입의 문자열입니다.
+
+### 형식 구문
+
+{{csssyntax}}
+
+## 접근성
+
+브라우저는 배경 이미지에 대한 특수한 정보를 보조 기술로 제공하지 않습니다. 이는 주로 화면 리더기를 위한 기능인데, 스크린 리더는 배경 이미지의 존재를 알리지 않기 때문에 사용자는 아무런 정보를 전달 받을 수 없습니다. 만일 이미지에 페이지의 전반적인 목적을 이해하는 데에 중요한 정보가 포함되어 있다면 이를 문서 안에서 의미론적으로 설명하는 것이 좋습니다.
+
+- [MDN WCAG 이해하기, 가이드라인 1.1 설명](/ko/docs/Web/Accessibility/Understanding_WCAG/Perceivable#guideline_1.1_—_providing_text_alternatives_for_non-text_content)
+- [Success Criterion 1.1.1 이해하기 | W3C Understanding WCAG 2.0](https://www.w3.org/TR/2016/NOTE-UNDERSTANDING-WCAG20-20161007/text-equiv-all.html)
+
+## 예제
+
+### background-image 옵션으로 대안으로 image-set()를 사용하기
+
+이 예제는 [`image-set()`](https://drafts.csswg.org/css-images-4/#funcdef-image-set) 가 두 개의 {{cssxref("background-image")}} 옵션의 대안, 즉 일반적인 버전과 고해상도 버전의 해상도를 어떻게 제공하는지에 대해 설명합니다.
+
+{{EmbedGHLiveSample("css-examples/images/image-set.html", '100%', 600)}}
+
+> [!NOTE]
+> 위 예제에서처럼, `-webkit` 접미사는 크롬과 사파리에서도 사용할 수 있습니다. 파이어폭스 90에서는 (개발자가 표준 속성을 추가하지 않은 경우 호환성을 제공하기 위해) `-webkit-image-set()` 가 `image-set()` 의 별칭으로 사용됩니다.
+
+### 이미지 확장자의 대안으로 image-set()를 사용하기
+
+다음 예제에서는 `type()` 함수가 AVIF 와 JPEG 확장자를 전달하기 위해 사용될 수도 있음을 설명합니다. 만일 브라우저가 avif를 지원한다면 이는 해당 버전을 선택하게 되고, 그렇지 않다면 jpeg 버전을 사용하게 됩니다.
+
+{{EmbedGHLiveSample("css-examples/images/image-set-type.html", '100%', 600)}}
+
+#### 폴백 제공하기
+
+`image-set()` 을 위한 내장 폴백은 존재하지 않습니다. 이 기능을 지원하지 않는 브라우저를 위해 {{cssxref("background-image")}} 를 포합하려면 `image-set()` 를 사용하는 줄 앞에 별도의 정의가 필요합니다.
+
+```css
+.box {
+  background-image: url("large-balloons.jpg");
+  background-image: image-set(
+    "large-balloons.avif" type("image/avif"),
+    "large-balloons.jpg" type("image/jpeg")
+  );
+}
+```
+
+## 명세서
+
+{{Specifications}}
+
+## 브라우저 호환성
+
+{{Compat}}
+
+## 같이 보기
+
+- {{cssxref("image")}}
+- {{cssxref("image/image", "image()")}}
+- {{cssxref("element", "element()")}}
+- {{cssxref("url", "url()")}}
+- {{cssxref("&lt;gradient&gt;")}}
+- {{cssxref("cross-fade", "cross-fade()")}}

From 1b0002bca6224d67b2ff3b338b0f946168841b87 Mon Sep 17 00:00:00 2001
From: Yoon <yheedev@gmail.com>
Date: Sun, 29 Sep 2024 22:03:55 +0900
Subject: [PATCH 35/43] =?UTF-8?q?[ko]=20Center=20an=20element=20=EC=8B=A0?=
 =?UTF-8?q?=EA=B7=9C=20=EB=B2=88=EC=97=AD=20=20(#23378)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* ko\web\css\layout_cookbook\Center an element 번역

* page-type 삭제, mdn 링크 및 번역 내용 수정

* lint 이슈 해결

* Update files/ko/web/css/layout_cookbook/center_an_element/index.md

* Update files/ko/web/css/layout_cookbook/center_an_element/index.md

---------

Co-authored-by: hochan Lee <hochan049@gmail.com>
---
 .../center_an_element/index.md                | 98 +++++++++++++++++++
 1 file changed, 98 insertions(+)
 create mode 100644 files/ko/web/css/layout_cookbook/center_an_element/index.md

diff --git a/files/ko/web/css/layout_cookbook/center_an_element/index.md b/files/ko/web/css/layout_cookbook/center_an_element/index.md
new file mode 100644
index 00000000000000..a1c12ce0aa6bff
--- /dev/null
+++ b/files/ko/web/css/layout_cookbook/center_an_element/index.md
@@ -0,0 +1,98 @@
+---
+title: 요소의 중앙 정렬
+slug: Web/CSS/Layout_cookbook/Center_an_element
+l10n:
+  sourceCommit: 70f49e78d0f6830748fcaa490d98b4ae3e2da161
+---
+
+{{CSSRef}}
+
+이 조리법에서는 [flex 박스](#using_flexbox)와 [그리드](#using_grid)를 사용해서 박스를 다른 박스 내부에 중앙 정렬하는 방법을 배울 수 있습니다. 수평과 수직으로 중앙 정렬하는 것은 간단하고 직관적입니다.
+
+![an element centered inside a larger box](cookbook-center.png)
+
+## 요구 사항
+
+박스 내부의 아이템을 수평과 수직 방향으로 중앙 정렬합니다.
+
+## 조리법
+
+{{EmbedGHLiveSample("css-examples/css-cookbook/center.html", '100%', 720)}}
+
+> [!CALLOUT]
+>
+> [Download this example](https://github.com/mdn/css-examples/blob/main/css-cookbook/center--download.html)
+
+## 플렉스박스 사용하기
+
+박스를 다른 박스 내부에서 중앙 정렬하기 위해서는 먼저 감싸고 있는 박스에 {{cssxref("display")}} 속성을 `flex`로 지정해서 [flex 컨테이너](/ko/docs/Web/CSS/CSS_flexible_box_layout/Basic_concepts_of_flexbox#the_flex_container) 로 바꿔줍니다. 그 다음에 {{cssxref("align-items")}}를 `center`로 지정하여 수직 방향의 중앙 정렬(블록 축)을 하고, {{cssxref("justify-content")}}를 `center`로 설정하여 수평 방향의 중앙 정렬(인라인 축)을 합니다. 그러면 박스를 다른 박스 내부에서 중앙 정렬하는 데 필요한 모든 작업이 완료됩니다!
+
+### HTML
+
+```html
+<div class="container">
+  <div class="item">I am centered!</div>
+</div>
+```
+
+### CSS
+
+```css
+div {
+  border: solid 3px;
+  padding: 1em;
+  max-width: 75%;
+}
+.container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 8em;
+}
+```
+
+컨테이너의 높이를 지정하면 컨테이너 내부의 아이템이 실제로 수직 방향으로 중앙 정렬된 것을 확인할 수 있습니다.
+
+### 결과
+
+{{ EmbedLiveSample('Using_flexbox', 400, 200) }}
+
+컨테이너에 `align-items: center;`를 적용하는 대신, 내부 아이템에 {{cssxref("align-self")}}를 `center`로 지정해서 내부 아이템 자체를 수직으로 중앙 정렬할 수 있습니다.
+
+## 그리드 사용
+
+박스를 다른 박스 내부에서 중앙 정렬하는 또 다른 방법은 감싸고 있는 박스를 [그리드 컨테이너](/ko/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#grid_container)로 만들고 {{cssxref("place-items")}} 속성을 `center`로 지정해서 내부의 아이템들을 블록과 인라인 축에서 중앙 정렬 하는 것입니다.
+
+### HTML
+
+```html
+<div class="container">
+  <div class="item">I am centered!</div>
+</div>
+```
+
+### CSS
+
+```css
+div {
+  border: solid 3px;
+  padding: 1em;
+  max-width: 75%;
+}
+.container {
+  display: grid;
+  place-items: center;
+  height: 8em;
+}
+```
+
+### 결과
+
+{{ EmbedLiveSample('Using_grid', 400, 200) }}
+
+컨테이너에 `place-items: center;`를 적용하는 대신, 컨테이너에 {{cssxref("place-content", "place-content: center;")}}를 지정하거나 내부 아이템 자체에 {{cssxref("place-self", "place-self: center")}} 또는 {{cssxref("margin", "margin: auto;")}}를 지정하여 동일하게 중앙 정렬을 할 수 있습니다.
+
+## MDN 관련 문서
+
+- [Box alignment in flexbox](/ko/docs/Web/CSS/CSS_box_alignment/Box_alignment_in_flexbox)
+- [CSS box alignment guide](/ko/docs/Web/CSS/CSS_box_alignment)

From 712d48982714267eac7bd1ca3a91686cc9f2c270 Mon Sep 17 00:00:00 2001
From: Chanmin <kimchanmin1@gmail.com>
Date: Sun, 29 Sep 2024 22:19:11 +0900
Subject: [PATCH 36/43] docs(ko/webextensions): add korean translation of
 'user_interface' page (#23248)

---
 .../webextensions/user_interface/index.md     | 215 ++++++++++++++++++
 1 file changed, 215 insertions(+)
 create mode 100644 files/ko/mozilla/add-ons/webextensions/user_interface/index.md

diff --git a/files/ko/mozilla/add-ons/webextensions/user_interface/index.md b/files/ko/mozilla/add-ons/webextensions/user_interface/index.md
new file mode 100644
index 00000000000000..c2662e022bacdd
--- /dev/null
+++ b/files/ko/mozilla/add-ons/webextensions/user_interface/index.md
@@ -0,0 +1,215 @@
+---
+title: 사용자 인터페이스
+slug: Mozilla/Add-ons/WebExtensions/user_interface
+l10n:
+  sourceCommit: 668b38a4f6cd96609b9a969fe4653b46aec4e712
+---
+
+{{AddonSidebar}}
+
+WebExtension API를 사용하는 확장 프로그램은 사용자에게 기능을 제공할 수 있도록 몇몇 사용자 인터페이스 옵션을 제공합니다. 이러한 옵션들의 요약은 아래에 제공되며, 각 사용자 인터페이스 옵션에 대한 자세한 소개는 이 섹션에서 다룹니다.
+
+> [!NOTE]
+> 확장 프로그램에서 UI 컴포넌트를 사용해 훌륭한 사용자 경험을 만들기 위한 조언을 얻고 싶다면 [User experience best practices](https://extensionworkshop.com/documentation/develop/user-experience-best-practices/)를 참고하세요.
+
+<table class="standard-table">
+  <thead>
+    <tr>
+      <th scope="col">UI 옵션</th>
+      <th scope="col">내용</th>
+      <th scope="col">예시</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>
+        <a
+          href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Toolbar_button"
+          >툴바 버튼</a
+        >
+        (브라우저 동작)
+      </td>
+      <td>
+        클릭했을 때 확장 프로그램에 이벤트를 전달하는 브라우저 툴바의 버튼입니다. 이 버튼은 기본적으로 모든 탭에서 보입니다.
+      </td>
+      <td>
+        <img
+          alt="툴바(브라우저 동작) 버튼을 보여주는 예시"
+          src="browser-action.png"
+        />
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <a href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Popups">팝업</a>이 있는 툴바 버튼
+      </td>
+      <td>
+       브라우저 툴바의 버튼을 클릭하면 열리는 팝업입니다. 팝업은 HTML 문서에 정의되어 사용자 상호작용을 처리합니다.
+      </td>
+      <td>
+        <img
+          alt="툴바 버튼의 팝업 예시"
+          src="popup-shadow.png"
+        />
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <a
+          href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Page_actions"
+          >주소 바 버튼</a
+        >
+        (페이지 동작)
+      </td>
+      <td>
+        클랙했을 때 확장 프로그램에 이벤트를 전달하는 브라우저 주소 바의 버튼입니다. 이 버튼은 기본적으로 모든 탭에서 보이지 않습니다.
+      </td>
+      <td>
+        <img
+          alt="주소 바 버튼(페이지 액션)을 보여주는 예시"
+          src="address_bar_button.png"
+        />
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <a href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Popups">팝업</a>이 있는 주소 바 버튼
+      </td>
+      <td>
+        주소 바의 버튼을 클릭하면 열리는 팝업입니다. 팝업은 HTML 문서에 정의되어 사용자 상호작용을 처리합니다.
+      </td>
+      <td>
+        <img
+          alt="주소 바 버튼의 팝업 예시"
+          src="page_action_popup.png"
+        />
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <a
+          href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Context_menu_items"
+          >맥락 메뉴 항목</a
+        >
+      </td>
+      <td>
+        하나 이상의 브라우저 맥락 메뉴의 메뉴 항목, 체크박스, 라디오 버튼입니다. 또한, 구분선을 추가하여 메뉴를 구조화할 수도 있습니다. 메뉴 항목들이 클릭되면 이벤트가 확장 프로그램에 전달됩니다.
+      </td>
+      <td>
+         <img
+          alt="context-menu-demo 예제에서 WebExtension이 추가한 컨텍스트 메뉴 항목의 예시"
+          src="context_menu_example.png"
+        />
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <a
+          href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Sidebars"
+          >사이드바</a
+        >
+      </td>
+      <td>
+         <p>
+          웹 페이지 옆에 표시되는 HTML 문서로 페이지마다 고유한 콘텐츠를 표시할 수 있습니다. 사이드바는 확장 프로그램이 설치될 때 열리며, 이후 사용자의 사이드바 가시성 선택을 따릅니다. 사이드바 내의 사용자 상호작용은 해당 HTML 문서에서 처리됩니다.
+        </p>
+      </td>
+      <td><img alt="사이드바의 예시" src="bookmarks-sidebar.png" /></td>
+    </tr>
+    <tr>
+      <td>
+        <a
+          href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Options_pages"
+          >옵션 페이지</a
+        >
+      </td>
+       <td>
+        확장 프로그램의 설정을 정의할 수 있는 페이지로 사용자가 이 설정을 변경할 수 있습니다.
+        사용자는 브라우저의 애드온 관리자에서 이 페이지에 접근할 수 있습니다.
+      </td>
+      <td>
+        <img
+          alt="즐겨찾는 색상 예시에서 옵션 페이지에 추가된 내용을 보여주는 예시."
+          src="options_page.png"
+        />
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <a
+          href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Extension_pages"
+          >확장 프로그램 페이지</a
+        >
+      </td>
+       <td>
+       확장 프로그램에 포함된 웹 페이지를 사용하여 창이나 탭 내에서 양식, 도움말 또는 필요한 기타 콘텐츠를 제공할 수 있습니다.
+      </td>
+      <td>
+        <img
+          alt="분리된 패널로 표시되는 간단한 번들 페이지의 예시"
+          src="bundled_page_as_panel_small.png"
+        />
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <a
+          href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Notifications"
+          >알림</a
+        >
+      </td>
+      <td>
+        운영체제의 알림 메커니즘을 통해 사용자에게 표시되는 일시적인 알림입니다. 사용자가 알림을 클릭하거나 알림이 자동으로 또는 사용자의 요청으로 닫힐 때, 확장 프로그램으로 이벤트가 전달됩니다.
+      </td>
+      <td>
+        <img
+          alt="확장 프로그램에 의해 트리거된 시스템 알림의 예시"
+          src="notify-shadowed.png"
+        />
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <a
+          href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Omnibox"
+          >주소 바 제안</a
+        >
+      </td>
+      <td>
+        사용자가 키워드를 입력할 때 맞춤 주소 표시줄 제안을 제공합니다.
+      </td>
+      <td>
+        <img
+          alt="firefox_code_search 확장 프로그램이 주소 표시줄 제안을 커스터마이즈한 결과를 보여주는 예시."
+          src="omnibox_example_small.png"
+        />
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <a
+          href="/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/devtools_panels"
+          >개발자 도구 패널</a
+        >
+      </td>
+      <td>
+        브라우저의 개발자 도구에 표시되는 HTML 문서가 연결된 탭.
+      </td>
+      <td>
+        <img
+          alt="Example showing the result of the firefox_code_search WebExtension&#x27;s customization of the address bar suggestions."
+          src="developer_panel_tab.png"
+        />
+      </td>
+    </tr>
+
+  </tbody>
+</table>
+
+다음의 사용 방법 가이드에서는 이러한 사용자 인터페이스 옵션 중 일부를 만드는 방법을 단계별로 안내합니다.
+
+- [접근성 가이드라인](https://extensionworkshop.com/documentation/develop/build-an-accessible-extension/)
+- [툴바에 버튼 추가하기](/ko/docs/Mozilla/Add-ons/WebExtensions/Add_a_button_to_the_toolbar)
+- [브라우저 스타일](/ko/docs/Mozilla/Add-ons/WebExtensions/user_interface/Browser_styles)
+- [개발자 도구 확장하기](/ko/docs/Mozilla/Add-ons/WebExtensions/Extending_the_developer_tools)
+- [설정 페이지 구현하기](/ko/docs/Mozilla/Add-ons/WebExtensions/Implement_a_settings_page)

From 167044766d1c3ac4a017421c048e47e41e6d4d58 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EB=85=B8=ED=98=84=EC=A3=BC?=
 <38433755+nohj0518@users.noreply.github.com>
Date: Sun, 29 Sep 2024 22:30:01 +0900
Subject: [PATCH 37/43] =?UTF-8?q?[ko]=20document.scripts=20=EC=8B=A0?=
 =?UTF-8?q?=EA=B7=9C=20=EB=B2=88=EC=97=AD=20(#23661)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* [ko] document.scripts 신규 번역

* fix translate

* fix translate
---
 files/ko/web/api/document/scripts/index.md | 34 ++++++++++++++++++++++
 1 file changed, 34 insertions(+)
 create mode 100644 files/ko/web/api/document/scripts/index.md

diff --git a/files/ko/web/api/document/scripts/index.md b/files/ko/web/api/document/scripts/index.md
new file mode 100644
index 00000000000000..3d91925219767b
--- /dev/null
+++ b/files/ko/web/api/document/scripts/index.md
@@ -0,0 +1,34 @@
+---
+title: Document.scripts
+slug: Web/API/Document/scripts
+l10n:
+  sourceCommit: 904f8c3d9c8a54e917f8db565bcfe58f976d859c
+---
+
+{{APIRef("DOM")}}
+
+**`scripts`** 는 {{domxref("Document")}}인터페이스의 속성으로 문서 중{{HTMLElement("script")}} 요소의 목록을 반환합니다. 반환되는 객체는 단일 {{domxref("HTMLCollection")}} 객체입니다.
+
+## 값
+
+{{domxref("HTMLCollection")}}입니다. 이를 사용하여 목록의 모든 요소를 배열처럼 가져올 수 있습니다.
+
+## 예제
+
+다음은 페이지 내 {{HTMLElement("script")}} 요소의 존재를 확인하는 예시입니다.
+
+```js
+let scripts = document.scripts;
+
+if (scripts.length) {
+  alert("This page has scripts!");
+}
+```
+
+## 명세서
+
+{{Specifications}}
+
+## 브라우저 호환성
+
+{{Compat}}

From a36d8064f6ac13c0e15f356ab23013b04f9ca07f Mon Sep 17 00:00:00 2001
From: MaakCode <maakcode@gmail.com>
Date: Sun, 29 Sep 2024 22:49:20 +0900
Subject: [PATCH 38/43] [Ko] translate
 learn/javascript/building_blocks/event_bubbling (#23202)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

[ko] Event Bubbling 신규 번역
---
 .../building_blocks/event_bubbling/index.md   | 417 ++++++++++++++++++
 1 file changed, 417 insertions(+)
 create mode 100644 files/ko/learn/javascript/building_blocks/event_bubbling/index.md

diff --git a/files/ko/learn/javascript/building_blocks/event_bubbling/index.md b/files/ko/learn/javascript/building_blocks/event_bubbling/index.md
new file mode 100644
index 00000000000000..c1fdd5a269d22f
--- /dev/null
+++ b/files/ko/learn/javascript/building_blocks/event_bubbling/index.md
@@ -0,0 +1,417 @@
+---
+title: 이벤트 버블링
+slug: Learn/JavaScript/Building_blocks/Event_bubbling
+l10n:
+  sourceCommit: bc0d0d1ef796435e969f6d65c7e5d3c08f4023aa
+---
+
+{{LearnSidebar}}{{PreviousMenuNext("Learn/JavaScript/Building_blocks/Events","Learn/JavaScript/Building_blocks/Image_gallery", "Learn/JavaScript/Building_blocks")}}
+
+웹 페이지는 제목, 텍스트 단락, 이미지, 버튼 등 "요소"로 구성되어 있으며 이러한 요소에 발생하는 이벤트를 수신할 수 있다는 것을 살펴보았습니다. 예를 들어, 버튼에 수신기를 추가하면 사용자가 버튼을 클릭했을 때 실행됩니다.
+
+또한 이러한 요소가 서로 "중첩"될 수 있다는 것을 보았습니다. 예를 들어, {{htmlelement("button")}}은 {{htmlelement("div")}} 요소 안에 놓일 수 있습니다. 이 때 `<div>` 요소를 "부모" 요소라고 부르고 `<button>`을 "자식" 요소라고 부릅니다.
+
+이번 장에서는 부모 요소에 이벤트 수신기를 추가했을 때 사용자가 자식 요소를 클릭하면 어떤 일이 일어나는지 살펴보겠습니다.
+
+## 이벤트 버블링 소개
+
+### 부모 요소에 수신기 설정하기
+
+다음과 같은 웹 페이지가 있다고 가정해 봅시다.
+
+```html
+<div id="container">
+  <button>여기를 클릭하세요!</button>
+</div>
+<pre id="output"></pre>
+```
+
+여기서 버튼은 다른 요소인 {{HTMLElement("div")}} 안에 있습니다. 이 `<div>` 요소는 내부에 포함된 요소의 **부모**라고 합니다. 부모에 클릭 이벤트 처리기를 추가한 다음 버튼을 클릭하면 어떻게 될까요?
+
+```js
+const output = document.querySelector("#output");
+function handleClick(e) {
+  output.textContent += `${e.currentTarget.tagName} 요소를 클릭했습니다.\n`;
+}
+
+const container = document.querySelector("#container");
+container.addEventListener("click", handleClick);
+```
+
+{{ EmbedLiveSample('Setting a listener on a parent element', '100%', 200, "", "") }}
+
+사용자가 버튼을 클릭하면 부모가 클릭 이벤트를 방출하는 것을 볼 수 있습니다.
+
+```plain
+DIV 요소를 클릭했습니다.
+```
+
+버튼이 `<div>` 안에 있으므로 버튼을 클릭하면 암시적으로 버튼 안에 있는 요소도 클릭하게 됩니다.
+
+### 버블링 예제
+
+버튼과 부모 "둘 다" 이벤트 수신기를 추가하면 어떻게 될까요?
+
+```html
+<body>
+  <div id="container">
+    <button>여기를 클릭하세요!</button>
+  </div>
+  <pre id="output"></pre>
+</body>
+```
+
+버튼과 부모(`<div>`), 그리고 두 요소를 모두 포함하는 {{HTMLElement("body")}} 요소에 클릭 이벤트 처리기를 추가해 보겠습니다.
+
+```js
+const output = document.querySelector("#output");
+function handleClick(e) {
+  output.textContent += `${e.currentTarget.tagName} 요소를 클릭했습니다.\n`;
+}
+
+const container = document.querySelector("#container");
+const button = document.querySelector("button");
+
+document.body.addEventListener("click", handleClick);
+container.addEventListener("click", handleClick);
+button.addEventListener("click", handleClick);
+```
+
+{{ EmbedLiveSample('Bubbling example', '100%', 200, "", "") }}
+
+사용자가 버튼을 클릭하면 세 요소 모두 클릭 이벤트를 방출하는 것을 볼 수 있습니다.
+
+```plain
+BUTTON 요소를 클릭했습니다.
+DIV 요소를 클릭했습니다.
+BODY 요소를 클릭했습니다.
+```
+
+이 경우는 다음과 같습니다.
+
+- 버튼 클릭이 먼저 일어납니다.
+- 그 다음에 부모(`<div>` 요소) 클릭이 일어납니다.
+- 그리고 `<div>` 요소의 부모(`<body>` 요소) 클릭이 일어납니다.
+
+이를 이벤트가 클릭한 가장 안쪽의 요소에서 **상위로 버블링**된다고 설명할 수 있습니다.
+
+이 동작은 유용할 수도 있고 예상치 못한 문제를 일으킬 수도 있습니다. 다음 섹션에서는 이로 인해 발생하는 문제를 살펴보고 해결책을 찾아보겠습니다.
+
+### 동영상 플레이어 예제
+
+이 예제에서 페이지에 처음에는 숨겨져있는 동영상과 "동영상 표시"라는 버튼이 있습니다. 우리는 다음과 같은 상호작용을 원합니다.
+
+- 사용자가 "동영상 표시" 버튼을 클릭하면 동영상이 포함된 상자를 표시하지만 재생하지는 않습니다.
+- 사용자가 동영상을 클릭하면 재생합니다.
+- 사용자가 동영상 외부의 상자 어딘가를 클릭하면 상자를 숨깁니다.
+
+HTML은 다음과 같습니다.
+
+```html
+<button>동영상 표시</button>
+
+<div class="hidden">
+  <video>
+    <source
+      src="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.webm"
+      type="video/webm" />
+    <p>
+      이 브라우저는 HTML 동영상을 지원하지 않습니다. 대신
+      <a href="rabbit320.mp4">동영상 링크</a>를 제공합니다.
+    </p>
+  </video>
+</div>
+```
+
+HTML에는 다음이 포함됩니다.
+
+- `<button>` 요소
+- 초기에 `class="hidden"` 특성을 갖는 `<div>` 요소
+- `<div>` 요소 내부에 중첩된 `<video>` 요소.
+
+CSS 를 사용해 `"hidden"` 클래스를 설정한 요소를 숨기고 있습니다.
+
+```css hidden
+div {
+  width: 100%;
+  height: 100%;
+  background-color: #eee;
+}
+
+.hidden {
+  display: none;
+}
+
+div video {
+  padding: 40px;
+  display: block;
+  width: 400px;
+  margin: 40px auto;
+}
+```
+
+JavaScript는 다음과 같습니다.
+
+```js
+const btn = document.querySelector("button");
+const box = document.querySelector("div");
+const video = document.querySelector("video");
+
+btn.addEventListener("click", () => box.classList.remove("hidden"));
+video.addEventListener("click", () => video.play());
+box.addEventListener("click", () => box.classList.add("hidden"));
+```
+
+이렇게 하면 세 개의 `'click'` 이벤트 수신기가 추가됩니다.
+
+- 하나는 `<button>`에 있으며, `<video>`를 포함하는 `<div>`를 표시합니다.
+- 하나는 `<video>`에 있으며, 동영상을 재생합니다.
+- 하나는 `<div>`에 있으며, 동영상을 숨깁니다.
+
+예제가 어떻게 동작하는지 살펴보겠습니다.
+
+{{ EmbedLiveSample('Video_player_example', '100%', 500) }}
+
+버튼을 클릭하면 컨테이너와 그 안에 있는 동영상이 표시됩니다. 하지만 동영상을 클릭하면 동영상은 재생되지만 상자는 다시 숨겨집니다!
+
+동영상은 `<div>` 안에 있으며 그 일부입니다. 따라서 동영상을 클릭하면 두 이벤트 처리기가 "모두" 실행되어 이런 동작이 일어납니다.
+
+### stopPropagation() 으로 문제 해결하기
+
+이전 섹션에서 보았듯이 이벤트 버블링은 때때로 문제를 일으킬 수 있지만 이를 방지하는 방법이 있습니다.
+[`Event`](/ko/docs/Web/API/Event) 객체에는 [`stopPropagation()`](/ko/docs/Web/API/Event/stopPropagation)이라는 함수가 있으며 이벤트 처리기 내에서 호출되면 이벤트가 다른 요소로 버블링되는 것을 방지합니다.
+
+JavaScript를 다음과 같이 변경하여 현재 문제를 해결할 수 있습니다.
+
+```js
+const btn = document.querySelector("button");
+const box = document.querySelector("div");
+const video = document.querySelector("video");
+
+btn.addEventListener("click", () => box.classList.remove("hidden"));
+
+video.addEventListener("click", (event) => {
+  event.stopPropagation();
+  video.play();
+});
+
+box.addEventListener("click", () => box.classList.add("hidden"));
+```
+
+`<video>` 요소의 `'click'` 이벤트 처리기에서 이벤트 객체에 `stopPropagation()`을 호출하기만 하면 됩니다. 이렇게 하면 해당 이벤트가 상위 박스로 버블링되는 것을 멈출 수 있습니다. 이제 버튼을 클릭하고 동영상을 클릭해 보세요.
+
+{{EmbedLiveSample("Fixing the problem with stopPropagation()", '100%', 500)}}
+
+```html hidden
+<button>동영상 보기</button>
+
+<div class="hidden">
+  <video>
+    <source
+      src="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.webm"
+      type="video/webm" />
+    <p>
+      이 브라우저는 HTML 동영상을 지원하지 않습니다. 대신
+      <a href="rabbit320.mp4">동영상 링크</a>를 제공합니다.
+    </p>
+  </video>
+</div>
+```
+
+```css hidden
+div {
+  width: 100%;
+  height: 100%;
+  background-color: #eee;
+}
+
+.hidden {
+  display: none;
+}
+
+div video {
+  padding: 40px;
+  display: block;
+  width: 400px;
+  margin: 40px auto;
+}
+```
+
+## 이벤트 캡처
+
+이벤트 전파의 또 다른 형태로 "이벤트 캡처"가 있습니다. 이것은 이벤트 버블링과 비슷하지만 순서가 반대입니다. 즉, 이벤트가 대상의 가장 안쪽의 대상 요소에서 발생해서 그 다음으로 중첩이 적은 요소순으로 전파되는게 아니라, 반대로 "가장 적게 중첩된" 요소에서 발생해서 그 다음으로 중첩이 많은 요소순으로 대상에 도달할 때까지 전파됩니다.
+
+이벤트 캡처는 기본적으로 비활성화되어 있습니다. 활성화하려면 `addEventListener()`에서 `capture` 옵션을 전달해야 합니다.
+
+이 예제는 `capture` 옵션을 사용한다는 점을 제외하면 앞서 본 [버블링 예제](#버블링_예제)와 동일합니다.
+
+```html
+<body>
+  <div id="container">
+    <button>클릭해주세요!</button>
+  </div>
+  <pre id="output"></pre>
+</body>
+```
+
+```js
+const output = document.querySelector("#output");
+function handleClick(e) {
+  output.textContent += `${e.currentTarget.tagName} 요소를 클릭했습니다.\n`;
+}
+
+const container = document.querySelector("#container");
+const button = document.querySelector("button");
+
+document.body.addEventListener("click", handleClick, { capture: true });
+container.addEventListener("click", handleClick, { capture: true });
+button.addEventListener("click", handleClick);
+```
+
+{{ EmbedLiveSample('Event capture', '100%', 200, "", "") }}
+
+이 경우 메시지 순서는 반대입니다. `<body>` 이벤트 처리기가 먼저 실행되고, 그 다음에 `<div>` 이벤트 처리기가 실행되고, 그 다음에 `<button>` 이벤트 처리기가 실행됩니다.
+
+```plain
+BODY 요소를 클릭했습니다.
+DIV 요소를 클릭했습니다.
+BUTTON 요소를 클릭했습니다.
+```
+
+굳이 왜 버블링과 캡처링을 둘 다 쓰는걸까요? 브라우저 간의 호환성이 지금보다 훨씬 낮았던 예전에 Netscape는 이벤트 캡처링만 사용했고 Internet Explorer는 이벤트 버블링만 사용했습니다. W3C가 동작을 표준화하기로 결정하고 합의할 때, 최신 브라우저에 구현된 것처럼 둘 다 포함하는 시스템이 되었습니다.
+
+기본적으로 거의 모든 이벤트 처리기는 버블링 단계에서 등록되며, 대부분의 경우 이 동작이 더 합리적입니다.
+
+## 이벤트 위임
+
+이전 섹션에서는 이벤트 버블링으로 인해 발생하는 문제와 그 해결 방법을 살펴보았습니다. 이벤트 버블링은 성가신게 아니라 매우 유용할 수도 있습니다. 특히, **이벤트 위임**을 가능하게 합니다. 많은 자식 요소 중 하나와 사용자가 상호 작용할 때 특정 코드를 실행하려면, 부모 요소에 이벤트 수신기를 설정하고 자식 요소에서 발생한 이벤트가 부모로 버블링되도록 하면 됩니다. 이렇게 하면 각 자식 요소에 개별적으로 이벤트 수신기를 설정할 필요가 없습니다.
+
+사용자가 버튼을 클릭했을 때 전체 페이지의 배경색을 설정했던 첫 번째 예제로 돌아갑시다. 이번엔 페이지를 16개의 타일로 나누고 사용자가 해당 타일을 클릭했을 때 각 타일을 임의의 색상으로 설정하려고 합니다.
+
+HTML은 다음과 같습니다.
+
+```html
+<div id="container">
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+  <div class="tile"></div>
+</div>
+```
+
+타일의 크기와 위치를 설정하기 위해 간단한 CSS를 설정합니다.
+
+```css
+.tile {
+  height: 100px;
+  width: 25%;
+  float: left;
+}
+```
+
+JavaScript에서 모든 타일에 클릭 이벤트 처리기를 추가할 수 있습니다. 그러나 보다 간단하고 효율적인 옵션은 부모에 클릭 이벤트 처리기를 설정하고 이벤트 버블링을 사용하여 사용자가 타일을 클릭할 때 처리기가 실행되도록 하는 것입니다.
+
+```js
+function random(number) {
+  return Math.floor(Math.random() * number);
+}
+
+function bgChange() {
+  const rndCol = `rgb(${random(255)} ${random(255)} ${random(255)})`;
+  return rndCol;
+}
+
+const container = document.querySelector("#container");
+
+container.addEventListener("click", (event) => {
+  event.target.style.backgroundColor = bgChange();
+});
+```
+
+출력은 다음과 같습니다 (클릭해보십시오).
+
+{{ EmbedLiveSample('Event delegation', '100%', 430, "", "") }}
+
+> [!NOTE]
+> 이 예제에서, 우리는 `event.target`을 사용하여 이벤트의 대상이었던 요소(즉, 가장 안쪽 요소)를 가져오고 있습니다. 이 이벤트를 처리한 요소(이 경우 컨테이너)에 접근하고싶다면 `event.currentTarget`을 사용할 수 있습니다.
+
+> [!NOTE]
+> 전체 소스 코드는 [useful-eventtarget.html](https://github.com/mdn/learning-area/blob/main/javascript/building-blocks/events/useful-eventtarget.html)에서 볼 수 있습니다. 또한 [라이브 실행](https://mdn.github.io/learning-area/javascript/building-blocks/events/useful-eventtarget.html)도 참고하십시오.
+
+## `target` 과 `currentTarget`
+
+이 페이지에서 소개한 예제를 자세히 살펴보면, 클릭한 요소에 접근하기 위해 이벤트 객체의 두 가지 속성을 사용하고 있음을 알 수 있습니다. [부모 요소에 수신기 설정하기](#부모_요소에_수신기_설정하기)에서 {{domxref("Event.currentTarget", "event.currentTarget")}}을 사용하고, [이벤트 위임](#이벤트_위임)에서는 {{domxref("Event.target", "event.target")}}을 사용하고 있습니다.
+
+`target`이 이벤트가 처음 발생한 요소를 참조하는 반면 `currentTarget`은 이 이벤트 처리기가 연결된 요소를 참조하는 차이가 있습니다.
+
+이벤트가 상위로 버블링되는 동안 `target`은 동일하게 유지되는 반면, `currentTarget`은 계층구조 내 서로 다른 요소에 연결된 이벤트 처리기에 따라 달라집니다.
+
+위의 [버블링 예제](#버블링_예제)를 약간 변형하면 이를 확인할 수 있습니다. 이전과 같은 HTML을 사용하고 있습니다.
+
+```html
+<body>
+  <div id="container">
+    <button>클릭해주세요!</button>
+  </div>
+  <pre id="output"></pre>
+</body>
+```
+
+JavaScript는 `target`과 `currentTarget`을 모두 로깅하는것 외에는 거의 같습니다.
+
+```js
+const output = document.querySelector("#output");
+function handleClick(e) {
+  const logTarget = `Target: ${e.target.tagName}`;
+  const logCurrentTarget = `Current target: ${e.currentTarget.tagName}`;
+  output.textContent += `${logTarget}, ${logCurrentTarget}\n`;
+}
+
+const container = document.querySelector("#container");
+const button = document.querySelector("button");
+
+document.body.addEventListener("click", handleClick);
+container.addEventListener("click", handleClick);
+button.addEventListener("click", handleClick);
+```
+
+버튼을 클릭했을 때, 이벤트 처리기가 버튼 자체나 `<div>` 또는 `<body>` 에 연결되어 있어도 `target` 은 항상 버튼 요소라는 점을 주의하세요. 그러나 `currentTarget`은 현재 실행중인 이벤트 처리기의 요소로 식별됩니다.
+
+{{embedlivesample("target and currentTarget")}}
+
+`target` 속성은 위의 [이벤트 위임](#이벤트_위임) 예제처럼 이벤트 위임에서 자주 사용합니다.
+
+## 스킬 테스트!
+
+이 문서의 마지막까지 왔습니다. 그런데 가장 중요한 정보를 기억하고 있나요? 계속하기 전에 이 정보를 기억했는지 확인하려면 [스킬 테스트: 이벤트](/ko/docs/Learn/JavaScript/Building_blocks/Test_your_skills:_Events)를 참조하세요.
+
+## 요약
+
+이제 이 초기 단계에서 웹 이벤트에 대해 알아야 할 모든 것을 알게 되었을 것입니다.
+앞서 언급했듯이 이벤트는 코어 JavaScript의 일부가 아니며 브라우저 웹 API에서 정의되어 있습니다.
+
+또한 웹 API에서부터 브라우저 WebExtensions, Node.js(서버 측 JavaScript)와 같은 다른 영역에 이르기까지 JavaScript를 사용하는 맥락에 따라 다양한 이벤트 모델이 있다는 것을 이해하는 것이 중요합니다.
+지금 당장 이 모든 영역을 이해할 것으로 기대하지는 않지만 웹 개발을 배우면서 이벤트의 기본을 이해하는 데 확실히 도움이 됩니다.
+
+> [!NOTE]
+> 진행중에 막혔다면 [커뮤니케이션 채널](/ko/docs/MDN/Community/Communication_channels)에서 도움을 요청하세요.
+
+## 같이 보기
+
+- [domevents.dev](https://domevents.dev/) — 탐색을 통해 DOM 이벤트 시스템의 동작에 대해 학습할 수 있는 매우 유용한 대화형 놀이터 앱입니다.
+- [이벤트 참고서](/ko/docs/Web/Events)
+- [이벤트 순서](https://www.quirksmode.org/js/events_order.html) (캡처링과 버블링에 대한 논의) — 피터-폴 코흐가 매우 자세하게 설명한 글입니다.
+
+{{PreviousMenuNext("Learn/JavaScript/Building_blocks/Events","Learn/JavaScript/Building_blocks/Image_gallery", "Learn/JavaScript/Building_blocks")}}

From 34e885048163ed9487d08ca2cf8829369dba75ec Mon Sep 17 00:00:00 2001
From: Wongilk <108254103+Wongilk@users.noreply.github.com>
Date: Sun, 29 Sep 2024 23:01:47 +0900
Subject: [PATCH 39/43] =?UTF-8?q?[ko]=20Javascript=20try=5Fcatch=EB=AC=B8?=
 =?UTF-8?q?=20=EB=B2=88=EC=97=AD=20=20(#21760)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* translate_ko_try_catch

* delete page-type, browser-compat

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/ko/web/javascript/reference/statements/try...catch/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

---------

Co-authored-by: hochan Lee <hochan049@gmail.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
---
 .../reference/statements/try...catch/index.md | 314 ++++++++++++++++++
 1 file changed, 314 insertions(+)
 create mode 100644 files/ko/web/javascript/reference/statements/try...catch/index.md

diff --git a/files/ko/web/javascript/reference/statements/try...catch/index.md b/files/ko/web/javascript/reference/statements/try...catch/index.md
new file mode 100644
index 00000000000000..30ba3a337c7a0e
--- /dev/null
+++ b/files/ko/web/javascript/reference/statements/try...catch/index.md
@@ -0,0 +1,314 @@
+---
+title: try...catch
+slug: Web/JavaScript/Reference/Statements/try...catch
+l10n:
+  sourceCommit: 4e947e81afc753bedcaaba75f262a07b92511849
+---
+
+{{jsSidebar("Statements")}}
+
+**`try...catch`** 문은 `try` 블록과 `catch` 블록, `finally` 블록 중 하나 혹은 두 블록으로 구성됩니다. `try` 블록 내 코드가 먼저 실행되고, 만약 그 안에서 예외가 발생한다면 `catch` 블록 내 코드가 실행됩니다. `finally` 블록 내 코드는 항상 실행되며, 제어 흐름이 전체 구문을 종료하기 전에 실행됩니다.
+
+{{EmbedInteractiveExample("pages/js/statement-trycatch.html")}}
+
+## 문법
+
+```js-nolint
+try {
+  tryStatements
+} catch (exceptionVar) {
+  catchStatements
+} finally {
+  finallyStatements
+}
+```
+
+- `tryStatements`
+  - : `try` 블록에서 실행될 구문들입니다.
+- `catchStatements`
+  - : `try` 블록에서 예외가 발생했을 때 실행될 구문들입니다.
+- `exceptionVar` {{optional_inline}}
+  - : 해당 `catch` 블록에서 잡힌 예외를 담는 선택적 [식별자 혹은 패턴](#catch_binding)입니다. 만약 `catch` 블록에서 예외 값을 사용하지 않는 경우 `exceptionVar` 과 괄호를 생략할 수 있습니다.
+- `finallyStatements`
+  - : `try...catch...finally` 구문에서 제어 흐름이 빠져나가기 전에 실행되는 구문들입니다. 예외가 발생했는지 여부와 관계없이 항상 실행됩니다.
+
+## 설명
+
+`try` 문은 항상 `try` 블록으로 시작합니다. 그리고 `catch` 블록 또는 `finally` 블록 중 하나가 반드시 존재해야 합니다. `catch` 블록과 `finally` 블록을 모두 가질 수도 있습니다. 이렇게 해서 `try` 문에는 다음과 같은 세 가지 형태가 있습니다.
+
+- `try...catch`
+- `try...finally`
+- `try...catch...finally`
+
+다른 구조인 [`if`](/ko/docs/Web/JavaScript/Reference/Statements/if...else) 나 [`for`](/ko/docs/Web/JavaScript/Reference/Statements/for)와 달리, `try`, `catch`, `finally` 블록은 반드시 단일 구문이 아닌 중괄호 {} 로 감싸진 블록이어야 합니다.
+
+```js-nolint example-bad
+try doSomething(); // SyntaxError
+catch (e) console.log(e);
+```
+
+`catch` 블록에는 `try` 블록에서 예외가 발생했을 때 어떻게 처리할지에 대한 구문들이 포함됩니다. 만약 `try` 블록 내의 어떤 구문(또는 `try` 블록 내에서 호출된 함수)에서 예외가 발생하면, 제어 흐름이 즉시 `catch` 블록으로 전환됩니다. `try` 블록에서 예외가 발생하지 않으면 `catch` 블록은 실행되지 않습니다.
+
+`finally` 블록은 `try...catch...finally` 구문에서 제어 흐름이 빠져나가기 전에 항상 실행됩니다. 즉 예외가 발생했는지 여부와 관계없이, `finally` 블록은 항상 실행됩니다.
+
+하나 이상의 `try` 문을 중첩해서 사용할 수 있습니다. 내부 `try` 문에 `catch` 블록이 없는 경우, 외부 `try` 문의 `catch` 블록이 대신 사용됩니다. 즉, 즉, 중첩된 `try` 문 내에서 예외가 발생하면, 가장 가까운 상위 `catch` 블록이 해당 예외를 처리하게 됩니다.
+
+또한, `try` 문을 사용하여 JavaScript 예외를 처리할 수 있습니다. JavaScript 예외 처리에 대한 자세한 정보는 [JavaScript 안내서](/ko/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#exception_handling_statements)를 참고하시면 됩니다.
+
+### Catch 바인딩
+
+`try` 블록에서 예외가 발생하면, `exceptionVar`(즉, `catch (e)` 에서의 `e`)에 예외 값이 저장됩니다. 이 {{Glossary("binding")}}을 이용해 발생한 예외에 대한 정보를 얻을 수 있습니다. 이 {{Glossary("binding")}}은 `catch` 블록의 {{Glossary("Scope", "scope")}} 내에서만 사용할 수 있습니다.
+
+`exceptionVar`는 반드시 단일 식별자일 필요가 없습니다. [구조 분해 할당](/ko/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment)을 사용하여 여러 개의 식별자를 한 번에 할당할 수 있습니다.
+
+```js
+try {
+  throw new TypeError("oops");
+} catch ({ name, message }) {
+  console.log(name); // "TypeError"
+  console.log(message); // "oops"
+}
+```
+
+`catch` 절에 의해 생성된 바인딩은 `catch` 블록과 동일한 범위에 존재합니다. 따라서 catch 블록 내에서 선언된 변수는 `catch` 절에 의해 생성된 바인딩과 동일한 이름을 가질 수 없습니다. ([이 규칙에 한가지 예외가 있지만](/ko/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features#statements), 이는 더 이상 사용되지 않는 문법입니다.)
+
+```js-nolint example-bad
+try {
+  throw new TypeError("oops");
+} catch ({ name, message }) {
+  var name; // SyntaxError: Identifier 'name' has already been declared
+  let message; // SyntaxError: Identifier 'message' has already been declared
+}
+```
+
+예외 바인딩은 쓰기 가능합니다. 예를 들어, 예외 값을 정규화하여 {{jsxref("Error")}} 객체인지 확인할 수 있습니다.
+
+```js
+try {
+  throw "Oops; this is not an Error object";
+} catch (e) {
+  if (!(e instanceof Error)) {
+    e = new Error(e);
+  }
+  console.error(e.message);
+}
+```
+
+예외 값이 필요 없는 경우에는 괄호와 함께 예외 변수 자체를 생략할 수 있습니다.
+
+```js
+function isValidJSON(text) {
+  try {
+    JSON.parse(text);
+    return true;
+  } catch {
+    return false;
+  }
+}
+```
+
+### finally 블록
+
+`finally` 블록은 `try` 블록과 `catch` 블록(들)이 실행된 후에 실행할 구문들을 포함하지만, `try...catch...finally` 블록 다음의 구문들보다 먼저 실행됩니다. 제어 흐름은 항상 `finally` 블록으로 진입하며, 다음과 같은 방식 중 하나로 진행될 수 있습니다.
+
+- `try` 블록이 정상적으로 실행을 마치고 (예외가 발생하지 않은 경우)
+- `catch` 블록이 정상적으로 실행을 마치고
+- `try` 블록이나 `catch` 블록에서 제어 흐름 구문(`return`, `throw`, `break`, `continue`)이 실행되어 해당 블록을 벗어나기 직전에
+
+예외를 처리할 `catch` 블록이 없더라도 `try` 블록에서 예외가 발생한다면 `finally` 블록은 실행됩니다. 이러한 경우 `finally` 블록이 실행을 마친 직후 해당 예외가 다시 던져집니다.
+
+다음 예제는 finally 블록의 한 가지 사용 사례를 보여줍니다. 이 코드는 파일을 열고 그 파일을 사용하는 구문들을 실행합니다. 그리고 `finally` 블록은 예외가 발생했더라도 파일이 항상 닫히도록 보장합니다.
+
+```js
+openMyFile();
+try {
+  // tie up a resource
+  writeMyFile(theData);
+} finally {
+  closeMyFile(); // always close the resource
+}
+```
+
+`finally` 블록 내의 제어 흐름 구문(`return`, `throw`, `break`, `continue`)은 `try` 블록이나 `catch` 블록의 완료 값을 "가립니다". 아래 예시에서, `try`블록에서 1을 반환하려고 하지만, 반환하기 전에 제어 흐름이 `finally`블록에 먼저 전달되어 `finally` 블록의 반환 값(2)이 대신 반환됩니다.
+
+```js
+function doIt() {
+  try {
+    return 1;
+  } finally {
+    return 2;
+  }
+}
+
+doIt(); // returns 2
+```
+
+`finally` 블록 내에 제어 흐름 구문을 사용하는 것은 일반적으로 좋지 않은 생각입니다. `finally` 블록은 오직 정리 작업을 위한 코드에만 사용해야 합니다.
+
+## 예시
+
+### 무조건적 catch 블록
+
+`catch` 블록을 사용하면 `try` 블록 내에서 어떤 예외가 발생하든 `catch` 블록이 실행됩니다. 예를 들어, 다음 코드에서 예외가 발생하면 제어 흐름이 `catch` 블록으로 전달됩니다.
+
+```js
+try {
+  throw "myException"; // generates an exception
+} catch (e) {
+  // statements to handle any exceptions
+  logMyErrors(e); // pass exception object to error handler
+}
+```
+
+`catch` 블록에서는 식별자(`e`와 같은)를 지정하여 예외 객체의 값을 캡처할 수 있습니다. 이 식별자가 참조하는 예외 객체의 값은 `catch` 블록의 {{Glossary("Scope", "범위")}} 내에서만 사용할 수 있습니다.
+
+### 조건적 catch 블록
+
+여러 개의 `try...catch` 블록과 `if...else if...else` 구문을 조합하면 "조건부 `catch` 블록"을 만들 수 있습니다. 예를 들어, 다음과 같은 코드를 작성할 수 있습니다.
+
+```js
+try {
+  myroutine(); // may throw three types of exceptions
+} catch (e) {
+  if (e instanceof TypeError) {
+    // statements to handle TypeError exceptions
+  } else if (e instanceof RangeError) {
+    // statements to handle RangeError exceptions
+  } else if (e instanceof EvalError) {
+    // statements to handle EvalError exceptions
+  } else {
+    // statements to handle any unspecified exceptions
+    logMyErrors(e); // pass exception object to error handler
+  }
+}
+```
+
+조건부 `catch` 블록의 일반적인 사용 사례는 예상되는 일부 오류만 포착하고 억제한 후, 다른 경우에는 오류를 다시 던지는 것입니다.
+
+```js
+try {
+  myRoutine();
+} catch (e) {
+  if (e instanceof RangeError) {
+    // statements to handle this very common expected error
+  } else {
+    throw e; // re-throw the error unchanged
+  }
+}
+```
+
+이것은 Java와 같은 다른 프로그래밍 언어와 유사한 형태를 취할 수 있습니다.
+
+```java
+try {
+  myRoutine();
+} catch (RangeError e) {
+  // statements to handle this very common expected error
+}
+// Other errors are implicitly re-thrown
+```
+
+### 중첩 try 블록
+
+먼저, 다음과 같은 코드가 어떻게 되는지 살펴보겠습니다.
+
+```js
+try {
+  try {
+    throw new Error("oops");
+  } finally {
+    console.log("finally");
+  }
+} catch (ex) {
+  console.error("outer", ex.message);
+}
+
+// Logs:
+// "finally"
+// "outer" "oops"
+```
+
+이제 `catch` 블록을 추가하여 내부 `try` 블록에서 이미 예외를 포착한다면:
+
+```js
+try {
+  try {
+    throw new Error("oops");
+  } catch (ex) {
+    console.error("inner", ex.message);
+  } finally {
+    console.log("finally");
+  }
+} catch (ex) {
+  console.error("outer", ex.message);
+}
+
+// Logs:
+// "inner" "oops"
+// "finally"
+```
+
+이제 오류를 다시 발생시키겠습니다.
+
+```js
+try {
+  try {
+    throw new Error("oops");
+  } catch (ex) {
+    console.error("inner", ex.message);
+    throw ex;
+  } finally {
+    console.log("finally");
+  }
+} catch (ex) {
+  console.error("outer", ex.message);
+}
+
+// Logs:
+// "inner" "oops"
+// "finally"
+// "outer" "oops"
+```
+
+예외는 가장 가까운 `catch` 블록에서 한 번만 잡히게 되며, 다시 던져지지 않는 한 외부 `catch` 블록에서는 잡히지 않습니다. 물론 "내부" 블록(즉, `catch` 블록 내부)에서 새로운 예외가 발생한다면, "외부" 블록에서 해당 예외를 잡을 수 있습니다.
+
+### finally 블록에서의 반환하기
+
+만약 `finally` 블록에서 값을 반환하면, 해당 값이 전체 `try-catch-finally` 문의 반환 값이 됩니다. 이는 `try` 블록이나 `catch` 블록 내에 있는 `return` 문에 관계없이 적용됩니다. 이는 `catch` 블록 내에서 발생한 예외에도 포함합니다.
+
+```js
+(() => {
+  try {
+    try {
+      throw new Error("oops");
+    } catch (ex) {
+      console.error("inner", ex.message);
+      throw ex;
+    } finally {
+      console.log("finally");
+      return;
+    }
+  } catch (ex) {
+    console.error("outer", ex.message);
+  }
+})();
+
+// Logs:
+// "inner" "oops"
+// "finally"
+```
+
+`finally` 블록에서 값을 반환했기 때문에 (이는 전체 `try-catch-finally` 문의 반환 값) 외부로 "oops"는 전파되지 않습니다. 이는 `catch` 블록에서 반환된 어떤 값에도 동일하게 적용됩니다.
+
+## 명세서
+
+{{Specifications}}
+
+## 브라우저 호환성
+
+{{Compat}}
+
+## 관련 항목
+
+- {{jsxref("Error")}}
+- {{jsxref("Statements/throw", "throw")}}

From b2312dbbe11c1be9a1111477fe0bb3e52df6d498 Mon Sep 17 00:00:00 2001
From: ICE0208 <doky3307@naver.com>
Date: Mon, 30 Sep 2024 10:05:11 +0900
Subject: [PATCH 40/43] =?UTF-8?q?[ko]=20=EC=A3=BC=EC=84=9D=EC=97=90?=
 =?UTF-8?q?=EC=84=9C=20=EB=B6=88=ED=95=84=EC=9A=94=ED=95=9C=20=EB=B6=80?=
 =?UTF-8?q?=EB=B6=84=20=EC=A0=9C=EA=B1=B0=20(#23851)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

주석에서 불필요한 부분 제거
---
 .../ko/web/javascript/reference/global_objects/weakset/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/ko/web/javascript/reference/global_objects/weakset/index.md b/files/ko/web/javascript/reference/global_objects/weakset/index.md
index a12c11d5da6dca..02297c449b1228 100644
--- a/files/ko/web/javascript/reference/global_objects/weakset/index.md
+++ b/files/ko/web/javascript/reference/global_objects/weakset/index.md
@@ -99,7 +99,7 @@ ws.has(foo); // true
 ws.has(bar); // true
 
 ws.delete(foo); // set에서 foo를 제거
-ws.has(foo); // false, foo 는 이미 제거has been removed
+ws.has(foo); // false, foo 는 이미 제거
 ws.has(bar); // true, bar 는 유지 됨
 ```
 

From 69feb2fc5a9ffc0dc78f7c565cc0855a36ef186b Mon Sep 17 00:00:00 2001
From: abing <1786107245@qq.com>
Date: Mon, 30 Sep 2024 09:10:22 +0800
Subject: [PATCH 41/43] zh-cn: update 'Sending forms through JavaScript'
 (#23756)

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Jason Ren <40999116+jasonren0403@users.noreply.github.com>
---
 .../sending_forms_through_javascript/index.md | 397 ++++--------------
 1 file changed, 71 insertions(+), 326 deletions(-)

diff --git a/files/zh-cn/learn/forms/sending_forms_through_javascript/index.md b/files/zh-cn/learn/forms/sending_forms_through_javascript/index.md
index 5c4e9fae05141e..d965effa6becb2 100644
--- a/files/zh-cn/learn/forms/sending_forms_through_javascript/index.md
+++ b/files/zh-cn/learn/forms/sending_forms_through_javascript/index.md
@@ -2,380 +2,125 @@
 title: 使用 JavaScript 发送表单
 slug: Learn/Forms/Sending_forms_through_JavaScript
 l10n:
-  sourceCommit: 402d8cd44691881e55bf214a7c0cb02bcb817305
+  sourceCommit: 4414bc297a05373570250fe1fb154eab197f29ca
 ---
 
 {{LearnSidebar}}
 
-HTML 表单可以声明式地发送一个 [HTTP](/zh-CN/docs/Web/HTTP) 请求。但也可以通过 JavaScript 来为表单准备用于发送的 HTTP 请求（例如通过 `XMLHttpRequest`）。本文对这些方法进行了探讨。
+当用户提交 HTML 表单（如通过点击{{glossary("Submit_button", "提交按钮")}}）时，浏览器会发出 [HTTP](/zh-CN/docs/Web/HTTP) 请求，来发送表单中的数据。但是，web 应用有时会使用 JavaScript API（如 {{domxref("Window/fetch", "fetch()")}}），以编程方式将数据发送到期望提交表单的端点，而不是采用这种声明式方法。本文将解释为什么这是一个重要的用例，并说明如何实现它。
 
-## 表单不总是表单
+## 为什么使用 JavaScript 提交表单数据？
 
-在渐进式 Web 应用、单页应用和基于框架的应用中，通常会使用 [HTML 表单](/zh-CN/docs/Learn/Forms)来发送数据，而不会在收到响应数据时加载新文档。让我们先来谈谈为什么这需要一种不同的方法。
+根据文章[发送表单数据](/zh-CN/docs/Learn/Forms/Sending_and_retrieving_form_data)中的描述，标准 HTML 表单提交会加载发送数据的目标 URL，这意味着浏览器窗口将以加载整个页面的方式进行导航。
 
-### 获得整体界面的控制
+然而，许多 web 应用（特别是{{glossary("progressive web apps","渐进式 web 应用")}}和{{glossary("SPA","单页面应用")}}）都使用 JavaScript API 向服务器请求数据，并更新页面的相关部分，从而避免加载整个页面的开销。
 
-如前一篇文章所述，标准 HTML 表单提交会加载发送数据的 URL，这意味着浏览器窗口会以全页面加载的方式进行导航。避免全页面加载可以避免网络延迟和可能出现的视觉问题（如闪烁），从而提供更流畅的体验。
+因此，当这些 web 应用想要提交表单数据时，仅使用 HTML 表单来收集用户输入，而不提交数据。当用户尝试发送数据时，应用会接管控制权并使用 JavaScript API（如 {{domxref("Window/fetch", "fetch()")}}）来发送数据。
 
-许多现代用户界面只使用 HTML 表单来收集用户输入，而不是用于数据提交。当用户尝试发送数据时，应用程序会控制并在后台异步传输数据，只更新用户界面中需要更改的部分。
+## JavaScript 表单提交的问题
 
-### 表单提交和 AJAX 请求之间的区别？
+如果 Web 应用的服务器端点由开发人员控制，那么他们可以选择任意方式发送表单数据，例如以 JSON 对象的形式。
 
-{{domxref("XMLHttpRequest")}}（XHR）DOM 对象可以构建 HTTP 请求、发送请求并获取结果。从历史上看，{{domxref("XMLHttpRequest")}} 是为获取和发送 [XML](/zh-CN/docs/Web/XML) 作为交换格式而设计的，后来这种格式被 [JSON](/zh-CN/docs/Glossary/JSON) 所取代。但是，XML 和 JSON 都不适合表单数据请求编码。表单数据（`application/x-www-form-urlencoded`）由键/值对的 URL 编码列表组成。为了传输二进制数据，HTTP 请求被重塑为 `multipart/form-data`。
+然而，如果服务器端点希望提交表单，web 应用就必须以特定方式对数据进行编码。例如，如果数据仅为文本，则可以由 URL 编码的键/值对列表组成，并以 `application/x-www-form-urlencoded` 的 {{httpheader("Content-Type")}} 发送。如果表单包含二进制数据，则必须使用 `multipart/form-data` 内容类型发送。
 
-> [!NOTE]
-> 如今 [Fetch API](/zh-CN/docs/Web/API/Fetch_API) 常用于取代 XHR——它是 XHR 的更现代、更新的版本，工作原理类似，但有一些优点。你在本文中看到的大部分 XHR 代码都可以换成 Fetch。
+{{domxref("FormData")}} 接口以上述方式对数据进行编码，在本文的其余部分，我们将对 `FormData` 进行简要介绍。更多详情，请参阅[使用 FormData 对象](/zh-CN/docs/Web/API/XMLHttpRequest_API/Using_FormData_Objects)指南。
 
-如果你控制了前端（在浏览器中执行的代码）和后端（在服务器上执行的代码），就可以发送 JSON/XML，并随心所欲地处理它们。
+## 手动创建 `FormData` 对象
 
-但如果要使用第三方服务，就需要按照服务要求的格式发送数据。
+可以为要添加的每个字段调用其 {{domxref("FormData.append()", "append()")}} 方法（传入字段的名称和值），以此来填充 `FormData` 对象。对于文本字段，值可以是字符串；对于二进制字段（包括 {{domxref("File")}} 对象），值可以是 {{domxref("Blob")}}。
 
-那么我们应该如何发送这些数据呢？下面将介绍所需要的不同技术。
-
-## 发送表单数据
-
-一共有三种方式来发送表单数据：
-
-- 手工构建 `XMLHttpRequest`。
-- 使用独立的 `FormData` 对象。
-- 使用绑定到 `<form>` 元素的 `FormData`。
-
-让我们仔细看一下。
-
-### 手工构建 XMLHttpRequest
-
-{{domxref("XMLHttpRequest")}} 是进行 HTTP 请求的最安全可靠的方式。要使用 {{domxref("XMLHttpRequest")}} 发送表单数据，请通过 URL 编码准备数据，并遵守表单数据请求的具体规定。
-
-让我们看个示例：
-
-```html
-<button>点我！</button>
-```
-
-这是 JavaScript 代码部分：
-
-```js
-const btn = document.querySelector("button");
-
-function sendData(data) {
-  console.log("Sending data");
-
-  const XHR = new XMLHttpRequest();
-
-  const urlEncodedDataPairs = [];
-
-  // 将数据对象转换为 URL 编码的键/值对数组。
-  for (const [name, value] of Object.entries(data)) {
-    urlEncodedDataPairs.push(
-      `${encodeURIComponent(name)}=${encodeURIComponent(value)}`,
-    );
-  }
-
-  // 将配对合并为单个字符串，并将所有 % 编码的空格替换为
-  // “+”字符；匹配浏览器表单提交的行为。
-  const urlEncodedData = urlEncodedDataPairs.join("&").replace(/%20/g, "+");
-
-  // 定义成功数据提交时发生的情况
-  XHR.addEventListener("load", (event) => {
-    alert("耶！已发送数据并加载响应。");
-  });
-
-  // 定义错误提示
-  XHR.addEventListener("error", (event) => {
-    alert("哎呀！出问题了。");
-  });
-
-  // 建立我们的请求
-  XHR.open("POST", "https://example.com/cors.php");
-
-  // 为表单数据 POST 请求添加所需的 HTTP 头
-  XHR.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
-
-  // 最后，发送我们的数据。
-  XHR.send(urlEncodedData);
-}
-
-btn.addEventListener("click", () => {
-  sendData({ test: "ok" });
-});
-```
-
-这里是实时演示效果：
-
-{{EmbedLiveSample("构建_xmlhttprequest", "100%", 50)}}
-
-> [!NOTE]
-> 当你想要往第三方网站传输数据时，使用 {{domxref("XMLHttpRequest")}} 会受到{{glossary('same-origin policy', '同源策略')}}的影响。如果你需要执行跨源请求，你需要熟悉一下 [CORS 和 HTTP 访问控制](/zh-CN/docs/Web/HTTP/CORS)。
-
-### 使用 XMLHttpRequest 和 FormData 对象
-
-手动建立一个 HTTP 请求非常困难。幸运的是，[XMLHttpRequest 规范](https://www.w3.org/TR/XMLHttpRequest/)提供了一种方便简单的方法——利用 {{domxref("FormData","FormData")}} 对象来处理表单数据请求。
-
-{{domxref("FormData","FormData")}} 对象可以用来构建用于传输的表单数据，或是获取表单元素中的数据来管理它的发送方式。
-
-该对象的使用详见[使用 FormData 对象](/zh-CN/docs/Web/API/XMLHttpRequest_API/Using_FormData_Objects)，下面是两个示例：
-
-#### 使用一个独立的 FormData 对象
-
-```html
-<button>点我！</button>
-```
-
-你应该会觉得那个 HTML 示例很熟悉，现在来展示 JavaScript 代码：
+在下面的示例中，当用户点击按钮时，将以表单提交的形式发送数据：
 
 ```js
-const btn = document.querySelector("button");
-
-function sendData(data) {
-  const XHR = new XMLHttpRequest();
-  const FD = new FormData();
-
-  // 把我们的数据添加到这个 FormData 对象中
-  for (const [name, value] of Object.entries(data)) {
-    FD.append(name, value);
+async function sendData(data) {
+  // 构建一个 FormData 实例
+  const formData = new FormData();
+
+  // 添加一个文本字段
+  formData.append("name", "Pomegranate");
+
+  // 添加一个文件
+  const selection = await window.showOpenFilePicker();
+  if (selection.length > 0) {
+    const file = await selection[0].getFile();
+    formData.append("file", file);
   }
 
-  // 定义数据成功发送并返回后执行的操作
-  XHR.addEventListener("load", (event) => {
-    alert("耶！已发送数据并加载响应。");
-  });
-
-  // 定义发生错误时执行的操作
-  XHR.addEventListener("error", (event) => {
-    alert("Oops! 出错了。");
-  });
-
-  // 设置请求地址和方法
-  XHR.open("POST", "https://example.com/cors.php");
-
-  // 发送这个 formData 对象，HTTP 请求头会自动设置
-  XHR.send(FD);
-}
-
-btn.addEventListener("click", () => {
-  sendData({ test: "ok" });
-});
-```
-
-这里是实时演示效果：
-
-{{EmbedLiveSample("使用一个独立的_FormData_对象", "100%", 50)}}
-
-#### 使用绑定到表单元素上的 FormData
-
-你也可以把一个 `FormData` 对象绑定到一个 {{HTMLElement("form")}} 元素上。这会创建一个 `FormData` 对象，表示表单中包含的数据。
-
-这段 HTML 是典型的情况：
-
-```html
-<form id="myForm">
-  <label for="myName">告诉我你的名字：</label>
-  <input id="myName" name="name" value="小明" />
-  <input type="submit" value="提交" />
-</form>
-```
-
-但是 JavaScript 接管了这个表单：
-
-```js
-window.addEventListener("load", () => {
-  function sendData() {
-    const XHR = new XMLHttpRequest();
-
-    // 我们把这个 FormData 和表单元素绑定在一起。
-    const FD = new FormData(form);
-
-    // 我们定义了数据成功发送时会发生的事件
-    XHR.addEventListener("load", (event) => {
-      alert(event.target.responseText);
+  try {
+    const response = await fetch("https://example.org/post", {
+      method: "POST",
+      // 将 FormData 实例设置为请求正文
+      body: formData,
     });
-
-    // 我们定义了失败的情形下会发生的事件
-    XHR.addEventListener("error", (event) => {
-      alert("哎呀！出了一些问题。");
-    });
-
-    // 我们设置了我们的请求
-    XHR.open("POST", "https://example.com/cors.php");
-
-    // 发送的数据是由用户在表单中提供的
-    XHR.send(FD);
+    console.log(await response.json());
+  } catch (e) {
+    console.error(e);
   }
+}
 
-  // 获取表单元素
-  const form = document.getElementById("myForm");
-
-  // 接管表单的 submit 事件
-  form.addEventListener("submit", (event) => {
-    event.preventDefault();
-
-    sendData();
-  });
-});
+const send = document.querySelector("#send");
+send.addEventListener("click", sendData);
 ```
 
-这里是实时演示效果：
-
-{{EmbedLiveSample("使用绑定到表单元素上的_FormData", "100%", 50)}}
-
-你甚至可以通过使用表单的 {{domxref("HTMLFormElement.elements", "elements")}} 属性来更多的参与此过程，来得到一个包含表单里所有数据元素的列表，并且逐一手动管理它们。想了解更多，请参见示例[访问表单控件](/zh-CN/docs/Web/API/HTMLFormElement/elements#访问表单控件)。
-
-## 处理二进制数据
+1. 首先，构建一个新的、空的 `FormData` 对象。
+2. 接下来，调用 `append()` 两次，向 `FormData` 对象添加两个项目：一个文本字段和一个文件。
+3. 最后，我们使用 `fetch()` API 发出 {{httpmethod("POST")}} 请求，并将 `FormData` 对象设置为请求体。
 
-如果你使用一个含有 `<input type="file">` 组件的 {{domxref("FormData","FormData")}} 表单对象，数据会被自动处理。但是要手动发送二进制数据的话，还有额外的工作要做。
+请注意，不必设置 {{httpheader("Content-Type")}} 标头：当将 `FormData` 对象传入 `fetch()` 时，会自动设置正确的标头。
 
-在现代网络上，二进制数据有很多来源：例如 {{domxref("FileReader")}}、{{domxref("HTMLCanvasElement","Canvas")}}、[WebRTC](/zh-CN/docs/Web/API/Navigator/getUserMedia)，等等。不幸的是，一些过时的浏览器无法访问二进制数据，或是需要非常复杂的工作环境。这些遗留问题已经超出了本文的涵盖范围。如果你想了解更多关于 `FileReader` API 的知识，参见[如何在 web 应用程序中使用文件](/zh-CN/docs/Web/API/File_API/Using_files_from_web_applications)。
+## 关联 `FormData` 对象和 `<form>`
 
-发送二进制数据最简单的方法是使用 {{domxref("FormData", "FormData")}} 的 `append()` 方法，如上图所示。如果必须手工操作，就比较麻烦了。
+如果提交的数据来自 {{htmlelement("form")}}，则可以通过将表单传入 `FormData` 构造函数来填充 `FormData` 实例。
 
-在下面的例子中，我们使用了{{domxref("FileReader")}} API 来访问二进制数据，然后手动构建多部分表单数据请求：
+假设我们的 HTML 声明了一个 `<form>` 元素：
 
 ```html
-<form id="myForm">
+<form id="userinfo">
   <p>
-    <label for="theText">文本数据：</label>
-    <input id="theText" name="myText" value="一些文本数据" type="text" />
+    <label for="username">输入你的姓名：</label>
+    <input type="text" id="username" name="username" value="Dominic" />
   </p>
   <p>
-    <label for="theFile">文件数据：</label>
-    <input id="theFile" name="myFile" type="file" />
+    <label for="avatar">选择一个头像</label>
+    <input type="file" id="avatar" name="avatar" required />
   </p>
-  <button>提交！</button>
+  <input type="submit" value="Submit" />
 </form>
 ```
 
-如你所见，这个 HTML 只是一个标准的 `<form>`，没有什么神奇的事情。“魔法”都在 JavaScript 里：
+表单包含一个文本输入、一个文件输入和一个提交按钮。
+
+JavaScript 如下：
 
 ```js
-// 因为我们想获取 DOM 节点，
-// 我们在页面加载时初始化我们的脚本。
-window.addEventListener("load", () => {
-  // 这些变量用于存储表单数据
-  const text = document.getElementById("theText");
-  const file = {
-    dom: document.getElementById("theFile"),
-    binary: null,
-  };
-
-  // 使用 FileReader API 获取文件内容
-  const reader = new FileReader();
-
-  // 因为 FileReader 是异步的，会在完成读取文件时存储结果
-  reader.addEventListener("load", () => {
-    file.binary = reader.result;
-  });
-
-  // 页面加载时，如果一个文件已经被选择，那么读取该文件。
-  if (file.dom.files[0]) {
-    reader.readAsBinaryString(file.dom.files[0]);
-  }
+const form = document.querySelector("#userinfo");
 
-  // 如果没有被选择，一旦用户选择了它，就读取文件。
-  file.dom.addEventListener("change", () => {
-    if (reader.readyState === FileReader.LOADING) {
-      reader.abort();
-    }
-
-    reader.readAsBinaryString(file.dom.files[0]);
-  });
-
-  // 发送数据是我们需要的主要功能
-  function sendData() {
-    // 如果存在被选择的文件，等待它读取完成
-    // 如果没有，延迟函数的执行
-    if (!file.binary && file.dom.files.length > 0) {
-      setTimeout(sendData, 10);
-      return;
-    }
-
-    // 要构建我们的多部分表单数据请求，
-    // 我们需要一个 XMLHttpRequest 实例
-    const XHR = new XMLHttpRequest();
-
-    // 我们需要一个分隔符来定义请求的每一部分。
-    const boundary = "blob";
-
-    // 将我们的主体请求存储于一个字符串中
-    let data = "";
-
-    // 所以，如果用户已经选择了一个文件
-    if (file.dom.files[0]) {
-      // 在请求体中开始新的一部分
-      data += `--${boundary}\r\n`;
-
-      // 把它描述成表单数据
-      data +=
-        "content-disposition: form-data; " +
-        // 定义表单数据的名称
-        `name="${file.dom.name}"; ` +
-        // 提供文件的真实名字
-        `filename="${file.dom.files[0].name}"\r\n`;
-      // 和文件的 MIME 类型
-      data += `Content-Type: ${file.dom.files[0].type}\r\n`;
-
-      // 元数据和数据之间有一条空行。
-      data += "\r\n";
-
-      // 将二进制数据添加到主体请求中
-      data += file.binary + "\r\n";
-    }
-
-    // 文本数据更简单一些
-    // 在主体请求中开始一个新的部分
-    data += `--${boundary}\r\n`;
-
-    // 假设这是表单数据，并命名它
-    data += `content-disposition: form-data; name="${text.name}"\r\n`;
-    // 元数据和数据之间有一条空行。
-    data += "\r\n";
-
-    // 添加文本数据到主体请求中
-    data += text.value + "\r\n";
-
-    // 一旦完成，“关闭”主体请求
-    data += `--${boundary}--`;
-
-    // 定义成功提交数据执行的语句
-    XHR.addEventListener("load", (event) => {
-      alert("耶！已发送数据并加载响应。");
-    });
+async function sendData() {
+  // 将 FormData 对象与表单元素关联起来
+  const formData = new FormData(form);
 
-    // 定义发生错误时做的事
-    XHR.addEventListener("error", function (event) {
-      alert("哎呀！出现了一些问题。");
+  try {
+    const response = await fetch("https://example.org/post", {
+      method: "POST",
+      // 将 FormData 实例设置为请求正文
+      body: formData,
     });
-
-    // 建立请求
-    XHR.open("POST", "https://example.com/cors.php");
-
-    // 添加需要的 HTTP 头部来处理多部分表单数据 POST 请求
-    XHR.setRequestHeader(
-      "Content-Type",
-      `multipart/form-data; boundary=${boundary}`,
-    );
-
-    // 最后，发送数据。
-    XHR.send(data);
+    console.log(await response.json());
+  } catch (e) {
+    console.error(e);
   }
+}
 
-  // 获取表单元素
-  const form = document.getElementById("theForm");
-
-  // 添加 submit 事件处理器
-  form.addEventListener("submit", (event) => {
-    event.preventDefault();
-    sendData();
-  });
+// 接管表单提交
+form.addEventListener("submit", (event) => {
+  event.preventDefault();
+  sendData();
 });
 ```
 
-这里是实时演示效果：
-
-{{EmbedLiveSample("处理二进制数据", "100%", 150)}}
-
-## 总结
+为表单元素添加了一个提交事件处理程序。首先调用 {{domxref("Event.preventDefault()", "preventDefault()")}} 阻止浏览器内置的表单提交，这样我们就可以接手了。然后，调用 `sendData()` 来获取表单元素并将其传递给 `FormData` 构造函数。
 
-取决于不同的浏览器和正在处理数据的类型，通过 JavaScript 发送数据可能会很简单，也可能会很困难。{{domxref("FormData","FormData")}} 对象是通用的答案，所以请毫不犹豫地在旧浏览器上通过 [polyfill](https://github.com/jimmywarting/FormData) 使用它：
+之后，我们使用 `fetch()` 以 HTTP `POST` 请求的形式发送 `FormData` 实例。
 
 ## 参见
 

From 37fa3d8a8e0f3c85483638e5ee81b0d0fdc3c1ca Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Mon, 30 Sep 2024 09:15:45 +0800
Subject: [PATCH 42/43] [zh-cn]: sync translation for Permissions API (#23487)

Co-authored-by: Jason Ren <40999116+jasonren0403@users.noreply.github.com>
---
 files/zh-cn/web/api/permissions/index.md      |  6 +-
 .../zh-cn/web/api/permissions/query/index.md  | 27 ++++----
 .../zh-cn/web/api/permissions/revoke/index.md | 31 +++++----
 files/zh-cn/web/api/permissions_api/index.md  | 48 ++++++++++----
 .../using_the_permissions_api/index.md        | 66 +++++--------------
 .../api/workernavigator/permissions/index.md  |  4 +-
 6 files changed, 86 insertions(+), 96 deletions(-)

diff --git a/files/zh-cn/web/api/permissions/index.md b/files/zh-cn/web/api/permissions/index.md
index a277033bdb522b..684cb7e671be3f 100644
--- a/files/zh-cn/web/api/permissions/index.md
+++ b/files/zh-cn/web/api/permissions/index.md
@@ -2,7 +2,7 @@
 title: Permissions
 slug: Web/API/Permissions
 l10n:
-  sourceCommit: ee253ac58d71b2ed336b705ab97dbe93122b3e04
+  sourceCommit: 805d398f95c9d1ad8769e65d56bbfe2a31205021
 ---
 
 {{APIRef("Permissions API")}}{{AvailableInWorkers}}
@@ -13,10 +13,6 @@ l10n:
 
 - {{domxref("Permissions.query","Permissions.query()")}}
   - : 返回给定 API 的用户权限状态。
-- {{domxref("Permissions.request","Permissions.request()")}} {{Experimental_Inline}}
-  - : 请求使用给定 API 的权限。目前任何浏览器都不支持此功能。
-- {{domxref("Permissions.requestAll","Permissions.requestAll()")}} {{Experimental_Inline}} {{Non-standard_Inline}}
-  - : 请求使用一组给定 API 的权限。目前任何浏览器都不支持此功能。
 - {{domxref("Permissions.revoke","Permissions.revoke()")}} {{Deprecated_Inline}}
   - : 撤消当前在给定 API 上设置的权限。
 
diff --git a/files/zh-cn/web/api/permissions/query/index.md b/files/zh-cn/web/api/permissions/query/index.md
index 81d68ff3f7f150..f062e813d1b3ba 100644
--- a/files/zh-cn/web/api/permissions/query/index.md
+++ b/files/zh-cn/web/api/permissions/query/index.md
@@ -2,13 +2,17 @@
 title: Permissions：query() 方法
 slug: Web/API/Permissions/query
 l10n:
-  sourceCommit: ee253ac58d71b2ed336b705ab97dbe93122b3e04
+  sourceCommit: 3fde60e07c74ad4954a0c77fdd80958c7d07f088
 ---
 
 {{APIRef("Permissions API")}}{{AvailableInWorkers}}
 
 {{domxref("Permissions")}} 接口的 **`query()`** 方法会返回全局作用域中用户权限的状态。
 
+用户权限名称在每个功能的各自规范中定义。不同浏览器版本支持的权限在 [`Permissions` 接口的兼容性数据](/zh-CN/docs/Web/API/Permissions#浏览器兼容性)中列出（另请参阅 [Firefox 值](https://searchfox.org/mozilla-central/source/dom/webidl/Permissions.webidl#10)、[Chromium 值](https://chromium.googlesource.com/chromium/src/+/refs/heads/main/third_party/blink/renderer/modules/permissions/permission_descriptor.idl)和 [WebKit 值](https://github.com/WebKit/WebKit/blob/main/Source/WebCore/Modules/permissions/PermissionName.idl)的相关源代码）。
+
+每个权限所控制的 API 在[权限 API](/zh-CN/docs/Web/API/Permissions_API) 概述主题中的[权限相关的 API](/zh-CN/docs/Web/API/Permissions_API#权限相关的_api) 中列出。
+
 ## 语法
 
 ```js-nolint
@@ -19,23 +23,24 @@ query(permissionDescriptor)
 
 - `permissionDescriptor`
 
-  - : 一个为 `query` 操作设置选项的对象，由一个以逗号分隔的键——值对列表组成。可用的选项有：
+  - : 设置 `query` 操作选项的对象。此描述符的可用选项取决于权限类型。所有权限都有一个名称：
 
     - `name`
-      - : 要查询权限的 API 名称。每个浏览器支持不同的值集。Firefox 的值在[这里](https://searchfox.org/mozilla-central/source/dom/webidl/Permissions.webidl#10)，Chromium 的值在[这里](https://chromium.googlesource.com/chromium/src/+/refs/heads/main/third_party/blink/renderer/modules/permissions/permission_descriptor.idl)，WebKit 的值在[这里](https://github.com/WebKit/WebKit/blob/main/Source/WebCore/Modules/permissions/PermissionName.idl)。
-    - `userVisibleOnly`
-      - : （仅推送，不被 Firefox 所支持——请参阅下面的“浏览器兼容性”部分）表示是否希望为每条消息显示通知或发送静默推送通知。默认为 `false`。
-    - `sysex`（仅限 MIDI）
-      - : 表示是否需要接收系统专有信息。默认为 `false`。
+      - : 包含要查询其权限的 API 名称的字符串，例如 `camera`、`bluetooth`、`camera`、`geolocation`（有关更完整的列表，请参阅 [`Permissions`](/zh-CN/docs/Web/API/Permissions#浏览器兼容性)）。如果浏览器不支持权限名称，则返回的 {{jsxref("Promise")}} 将使用 {{jsxref("TypeError")}} 拒绝。
+
+    对于 `push` 权限，你还可以指定：
+
+    - `userVisibleOnly` {{optional_inline}}
+      - : （仅推送，Firefox 不支持——请参阅下面的浏览器支持部分）表示你是否要为每条消息显示通知或能够发送静默推送通知。默认值为 `false`。
 
-> [!NOTE]
-> 从 Firefox 44 开始，[Notifications](/zh-CN/docs/Web/API/Notifications_API) 和 [Push](/zh-CN/docs/Web/API/Push_API) 的权限已经合并。如果权限已授予（例如由用户在相关权限对话框中授予），`navigator.permissions.query()` 将为 `notifications` 和 `push` 返回 `true`。
+    对于 `midi` 权限，你还可以指定：
 
-> **备注：** `persistent-storage`权限允许根据 [Storage API](https://storage.spec.whatwg.org/) 使用持久盒（即[持久存储](https://storage.spec.whatwg.org/#persistence)）来进行存储。
+    - `sysex` {{optional_inline}}
+      - : 指示是否需要接收系统独有消息。默认值为 `false`。
 
 ### 返回值
 
-一个会兑现为 {{domxref("PermissionStatus")}} 对象的 {{jsxref("Promise")}}。
+一个兑现为 {{domxref("PermissionStatus")}} 对象的 {{jsxref("Promise")}}。
 
 ### 异常
 
diff --git a/files/zh-cn/web/api/permissions/revoke/index.md b/files/zh-cn/web/api/permissions/revoke/index.md
index 6535c7d1742d59..f2b72976e1b1bb 100644
--- a/files/zh-cn/web/api/permissions/revoke/index.md
+++ b/files/zh-cn/web/api/permissions/revoke/index.md
@@ -2,38 +2,43 @@
 title: Permissions：revoke() 方法
 slug: Web/API/Permissions/revoke
 l10n:
-  sourceCommit: afdbe078d7c0357430ff360538edafba3af5496d
+  sourceCommit: 3fde60e07c74ad4954a0c77fdd80958c7d07f088
 ---
 
 {{APIRef("Permissions API")}}{{AvailableInWorkers}}{{deprecated_header}}
 
 {{domxref("Permissions")}} 接口的 **`revoke()`** 方法可将当前设置的权限还原为默认状态，即通常的 `prompt` 状态。该方法在全局 {{domxref("Permissions")}} 对象 {{domxref("navigator.permissions")}} 上调用。
 
+此方法已从主要权限 API 规范中删除，因为其用例不明确。权限由浏览器管理，当前权限模型不涉及网站开发人员能够强制请求或撤销权限。浏览器已以首选项形式提供此 API，但它不太可能达到标准轨道。有关更多上下文，请参阅[删除 `permissions.revoke()` 的原始讨论](https://github.com/w3c/permissions/issues/46)。
+
 ## 语法
 
 ```js-nolint
-revoke(descriptor)
+revoke(permissionDescriptor)
 ```
 
 ### 参数
 
-- `descriptor`
-  - : 一个基于 `PermissionDescriptor` 字典的对象，用于设置由逗号分隔的键——值对列表组成的操作选项。可用的选项有：
+- `permissionDescriptor`
+
+  - : 设置 `revoke` 操作选项的对象。此描述符的可用选项取决于权限类型。所有权限都有一个名称：
+
     - `name`
-      - : 要查询其权限的 API 的名称。每个浏览器支持不同的值集。你可以查阅 [Firefox 的值](https://searchfox.org/mozilla-central/source/dom/webidl/Permissions.webidl#10)、[Chromium 的值](https://chromium.googlesource.com/chromium/src/+/refs/heads/main/third_party/blink/renderer/modules/permissions/permission_descriptor.idl)、[WebKit 的值](https://github.com/WebKit/WebKit/blob/main/Source/WebCore/Modules/permissions/PermissionName.idl)。
-    - `userVisibleOnly`
-      - : （仅限推送，Firefox 不支持——请参阅下面的[浏览器兼容性](#浏览器兼容性)部分）表示是否要为每条信息显示通知，还是能够发送静默推送通知。默认为 `false`。
-    - `sysex`（仅限 MIDI）
-      - : 表示是否需要接收系统专用消息。默认为 `false`。
+      - : 包含要查询其权限的 API 名称的字符串。如果浏览器不支持该权限名称，则返回的 {{jsxref("Promise")}} 将使用 {{jsxref("TypeError")}} 拒绝。
+
+    对于 `push` 权限，你还可以指定：
+
+    - `userVisibleOnly` {{optional_inline}}
+      - : （仅推送，Firefox 不支持——请参阅下面的浏览器支持部分）表示你是否要为每条消息显示通知或能够发送静默推送通知。默认值为 `false`。
 
-> [!NOTE]
-> 从 Firefox 44 开始，[Notifications](/zh-CN/docs/Web/API/Notifications_API) 和 [Push](/zh-CN/docs/Web/API/Push_API) 的权限已经合并。如果权限已授予（例如由用户在相关权限对话框中授予），`navigator.permissions.query()` 将为 `notifications` 和 `push` 返回 `true`。
+    对于 `midi` 权限，你还可以指定：
 
-> **备注：** `persistent-storage` 权限允许使用持久盒（即[持久存储](https://storage.spec.whatwg.org/#persistence)）进行存储，如 [Storage API](https://storage.spec.whatwg.org/) 所述。
+    - `sysex` {{optional_inline}}
+      - : 指示是否需要接收系统独有消息。默认值为 `false`。
 
 ### 返回值
 
-一个 {{jsxref("Promise")}}，其会在调用兑现处理器时传入指示请求的结果的 {{domxref("PermissionStatus")}} 对象。
+使用 {{domxref("PermissionStatus")}} 对象调用其兑现处理器以指示请求的结果的 {{jsxref("Promise")}}。
 
 ### 异常
 
diff --git a/files/zh-cn/web/api/permissions_api/index.md b/files/zh-cn/web/api/permissions_api/index.md
index f053a1393550d3..a922709ebb0489 100644
--- a/files/zh-cn/web/api/permissions_api/index.md
+++ b/files/zh-cn/web/api/permissions_api/index.md
@@ -2,29 +2,48 @@
 title: 权限 API
 slug: Web/API/Permissions_API
 l10n:
-  sourceCommit: ee253ac58d71b2ed336b705ab97dbe93122b3e04
+  sourceCommit: 3fde60e07c74ad4954a0c77fdd80958c7d07f088
 ---
 
 {{DefaultAPISidebar("Permissions API")}}{{AvailableInWorkers}}
 
-**权限 API**（Permissions API）提供一致的编程方式来查询归因于当前上下文的 API 权限的状态。例如，权限 API 可用于确定是否已授予或拒绝访问特定 API 的权限，或者是否需要特定的用户权限。
-
-请注意，此 API 的权限有效地聚合了上下文的所有安全限制，包括在安全上下文中使用 API 的任何要求，[Permissions-Policy](/zh-CN/docs/Web/HTTP/Headers/Permissions-Policy) 应用于文档的限制以及用户提示。因此，例如，如果 API 受到权限策略的限制，则返回的权限将被“拒绝”，并且不会提示用户访问。
+**权限 API** 提供了一种一致的编程方式来查询当前上下文（例如网页或 worker）的 API 权限状态。例如，它可用于确定访问特定功能或 API 的权限是否已被授予、被拒绝或需要特定用户权限。
 
 ## 概念和用法
 
-历史上不同的 API 对自己的权限的处理方式不一致——例如，[Notifications API](/zh-CN/docs/Web/API/Notifications_API) 提供了自己的方法来请求权限和检查权限状态，而 [Geolocation API](/zh-CN/docs/Web/API/Geolocation) 没有。权限 API 提供的工具允许开发者在使用权限时实现一致且更好的用户体验。
+历史上不同的 API 对自己的权限的处理方式不一致——例如，[Notifications API](/zh-CN/docs/Web/API/Notifications_API) 提供了自己的方法来请求权限和检查权限状态，而 [Geolocation API](/zh-CN/docs/Web/API/Geolocation) 没有。权限 API 提供的工具允许开发者在使用权限时实现一致的用户体验。
+
+此 API 的权限有效地汇总了上下文的所有安全限制，包括在安全上下文中使用 API 的任何要求、应用于文档的 [Permissions-Policy](/zh-CN/docs/Web/HTTP/Headers/Permissions-Policy) 限制、用户交互要求和用户提示。因此，例如，如果 API 受到权限策略的限制，则返回的权限将会为 `denied`，并且不会提示用户访问。
+
+`permissions` 属性已在 {{domxref("Navigator")}} 对象上可用，在标准浏览上下文和 worker 上下文中均可用（{{domxref("WorkerNavigator")}}——因此可在 worker 内进行权限检查），并返回 {{domxref("Permissions")}} 对象，该对象提供对权限 API 功能的访问。
+
+一旦你有了这个对象，你就可以使用 {{domxref("Permissions.query()")}} 方法返回一个通过 {{domxref("PermissionStatus")}} 兑现特定 API 的 promise。
+
+### 请求权限
+
+如果权限状态为 `prompt`，则用户必须确认提示以授予对该特性的访问权限。
+
+触发此提示的机制将取决于特定 API——它未定义为权限 API 的一部分。通常，触发器是调用方法来访问或打开该特性的代码，或者注册随后将访问该特性的通知的代码。
+
+请注意，并非所有功能都需要提示。权限可能由 `Permission Policy` 授予，由{{glossary("transient activation", "瞬态激活")}}隐式授予，或通过其他机制授予。
+
+### 撤销权限
 
-`permissions` 属性已在标准浏览上下文和 worker 上下文（{{domxref("WorkerNavigator")}} ——因此可以在 worker 内部进行权限检查）中的 {{domxref("Navigator")}} 对象上可用，并返回一个提供对权限 API 功能的访问的 {{domxref("Permissions")}} 对象。
+权限撤销不由 API 管理。更具体地说，{{domxref("Permissions.revoke()")}} 方法曾被提出，但此后已从实施该方法的浏览器中删除。
 
-获得此对象后，你可以使用 {{domxref("Permissions.query()")}} 方法返回一个 promise，该 promise 为特定的 API 解析 {{domxref("PermissionStatus")}} 对象。请注意，如果状态为 `prompt`，则用户必须在访问该功能之前确认提示，并且启动此提示的机制将取决于特定的 API——它并未定义为权限 API 的一部分。
+用户可以使用浏览器设置手动删除特定网站的权限：
+
+- **Firefox**：_菜单 > 设置 > 隐私和安全 > 权限_（然后选择感兴趣的权限的**设置**按钮）。
+- **Chrome**：_菜单 > 设置 > 显示高级设置_。在*隐私*部分中，单击*内容设置*。在出现的对话框中，找到*位置*部分并选择*当网站尝试... 时询问*。最后，单击*管理例外*并删除你授予你感兴趣的网站的权限。
 
 ### 权限相关的 API
 
 并非所有 API 的权限状态都可以通过权限 API 查询。权限相关的 API 的非详尽列表包括：
 
 - [Background Synchronization API](/zh-CN/docs/Web/API/Background_Synchronization_API)：`background-sync`（应当总是被授予）
-- [Geolocation API](/zh-CN/docs/Web/API/Geolocation_API)：`geolocation`
+- [Clipboard API](/zh-CN/docs/Web/API/Clipboard_API#安全考虑)：`clipboard-read`、`clipboard-write`
+- [Compute Pressure API](/zh-CN/docs/Web/API/Compute_Pressure_API)：`compute-pressure`
+- [Geolocation API](/zh-CN/docs/Web/API/Geolocation_API#security_considerations)：`geolocation`
 - [Local Font Access API](/zh-CN/docs/Web/API/Local_Font_Access_API)：`local-fonts`
 - [Media Capture and Streams API](/zh-CN/docs/Web/API/Media_Capture_and_Streams_API)：`microphone`、`camera`
 - [Notifications API](/zh-CN/docs/Web/API/Notifications_API)：`notifications`
@@ -34,15 +53,10 @@ l10n:
 - [Sensor APIs](/zh-CN/docs/Web/API/Sensor_APIs)：`accelerometer`、`gyroscope`、`magnetometer`、`ambient-light-sensor`
 - [Storage Access API](/zh-CN/docs/Web/API/Storage_Access_API)：`storage-access`、`top-level-storage-access`
 - [Storage API](/zh-CN/docs/Web/API/Storage_API)：`persistent-storage`
+- [Web Bluetooth API](/zh-CN/docs/Web/API/Web_Bluetooth_API)：`bluetooth`
 - [Web MIDI API](/zh-CN/docs/Web/API/Web_MIDI_API)：`midi`
 - [Window Management API](/zh-CN/docs/Web/API/Window_Management_API)：`window-management`
 
-## 示例
-
-我们创建了一个名为 Location Finder 的简单示例。你可以[实时运行示例](https://chrisdavidmills.github.io/location-finder-permissions-api/)，或[在 GitHub 上查看源代码](https://github.com/chrisdavidmills/location-finder-permissions-api/tree/gh-pages)。
-
-有关其工作原理的更多信息，请阅读我们的文章[使用权限 API](/zh-CN/docs/Web/API/Permissions_API/Using_the_Permissions_API)。
-
 ## 接口
 
 - {{domxref("Permissions")}}
@@ -55,6 +69,12 @@ l10n:
 - {{domxref("Navigator.permissions")}} 和 {{domxref("WorkerNavigator.permissions")}} {{ReadOnlyInline}}
   - : 分别用于访问主上下文和 worker 上下文的 {{domxref("Permissions")}} 对象。
 
+## 示例
+
+我们创建了一个名为 Location Finder 的简单示例。你可以[实时运行示例](https://chrisdavidmills.github.io/location-finder-permissions-api/)、[在 GitHub 上查看源代码](https://github.com/chrisdavidmills/location-finder-permissions-api/tree/gh-pages)，或者在我们的文章[使用权限 API](/zh-CN/docs/Web/API/Permissions_API/Using_the_Permissions_API)中阅读有关其工作原理的更多信息。
+
+[`Permissions.query()` 示例](/zh-CN/docs/Web/API/Permissions/query#测试对不同权限的支持)也展示了在当前浏览器上测试大多数权限并记录结果的代码。
+
 ## 规范
 
 {{Specifications}}
diff --git a/files/zh-cn/web/api/permissions_api/using_the_permissions_api/index.md b/files/zh-cn/web/api/permissions_api/using_the_permissions_api/index.md
index 276fbb9d77a124..2cc53eec70f687 100644
--- a/files/zh-cn/web/api/permissions_api/using_the_permissions_api/index.md
+++ b/files/zh-cn/web/api/permissions_api/using_the_permissions_api/index.md
@@ -1,27 +1,25 @@
 ---
-title: 使用 Permissions API
+title: 使用权限 API
 slug: Web/API/Permissions_API/Using_the_Permissions_API
 l10n:
-  sourceCommit: 3dbfd299e6f34873d6355bae4b12b5c1c69242f1
+  sourceCommit: 3fde60e07c74ad4954a0c77fdd80958c7d07f088
 ---
 
 {{DefaultAPISidebar("Permissions API")}}
 
-本文提供了使用 W3C [Permissions API](/zh-CN/docs/Web/API/Permissions_API)——它提供了一种用于查询当前上下文的 API 权限授权状态的编程方式——的基本指南。
+本文提供了使用[权限 API](/zh-CN/docs/Web/API/Permissions_API)——它提供了一种用于查询当前上下文的 API 权限授权状态的编程方式——的基本指南。
 
 ## 申请权限面临的困境
 
-惨淡的事实是，权限在 Web 开发中是令人厌恶却不得不面对的问题，对于开发者而言，处理它毫无乐趣。
+Web 上的权限是令人厌恶却不得不面对的问题，但对于开发人员来说，处理它们并不是一件有趣的事。
 
 由于历史原因，不同的 API 使用各自不同的方式来处理自己的权限──例如，[Notification API](/zh-CN/docs/Web/API/Notifications_API) 允许显式地检查权限状态和申请权限，然而，[Geolocation API](/zh-CN/docs/Web/API/Geolocation_API) 却不能。
 
-[Permissions API](/zh-CN/docs/Web/API/Permissions_API) 提供了一系列工具来让开发者在权限方面实现更好的用户体验。具体来说，开发人员可以使用 {{domxref("Permissions.query()")}} 来检查在当前上下文中使用特定 API 的权限是已授予、已拒绝还是需要通过提示获得特定用户权限。在主线程中查询权限是被[广泛支持](/zh-CN/docs/Web/API/Permissions_API#api.navigator.permissions)的，在 [Worker](/zh-CN/docs/Web/API/Permissions_API#api.workernavigator.permissions) 中也是如此（但有一个明显的例外）。
+[权限 API](/zh-CN/docs/Web/API/Permissions_API) 提供了一系列工具来让开发者在权限方面实现更好的用户体验。具体来说，开发人员可以使用 {{domxref("Permissions.query()")}} 来检查在当前上下文中使用特定 API 的权限是已授予、已拒绝还是需要通过提示获得特定用户权限。在主线程中查询权限是被[广泛支持](/zh-CN/docs/Web/API/Permissions_API#api.navigator.permissions)的，在 [Worker](/zh-CN/docs/Web/API/Permissions_API#api.workernavigator.permissions) 中也是如此（但有一个明显的例外）。
 
-许多 API 现在都能进行权限查询，例如 [Clipboard API](/zh-CN/docs/Web/API/Clipboard_API)、[Notifications API](/zh-CN/docs/Web/API/Notifications_API)
+许多 API 现已启用权限查询，例如 [Clipboard API](/zh-CN/docs/Web/API/Clipboard_API)、[Notifications API](/zh-CN/docs/Web/API/Notifications_API)、[Push API](/zh-CN/docs/Web/API/Push_API) 和 [Web MIDI API](/zh-CN/docs/Web/API/Web_MIDI_API)。[API 概览](/zh-CN/docs/Web/API/Permissions_API#权限相关的_api)中提供了许多权限启用的 API 列表，你可以在[此处的兼容性表](/zh-CN/docs/Web/API/Permissions_API#api.permissions)中了解浏览器支持情况。
 
-- [Push API](/zh-CN/docs/Web/API/Push_API)、[Web MIDI API](/zh-CN/docs/Web/API/Web_MIDI_API)。[API 概览](/zh-CN/docs/Web/API/Permissions_API#permission-aware_apis)中提供了许多启用权限的 API 的列表，你可以在[此处的兼容性表](/zh-CN/docs/Web/API/Permissions_API#api.permissions)中了解浏览器的支持情况。
-
-{{domxref("Permissions")}} 还有其他方法可用于专门请求使用 API 的权限和撤销权限，但这些方法已被弃用（非标准及不被广泛支持）。
+{{domxref("Permissions")}} 还有其他方法可用于专门请求使用 API 的权限和撤销权限，但这些方法已被弃用（非标准且不被广泛支持）。
 
 ## 一个简单的例子
 
@@ -29,22 +27,22 @@ l10n:
 
 ![英国格林菲尔德地图的截图](location-finder-with-permissions-api.png)
 
-你可以[在线运行示例](https://chrisdavidmills.github.io/location-finder-permissions-api/)，或[在 Github 查看源代码](https://github.com/chrisdavidmills/location-finder-permissions-api/tree/gh-pages)。大部分代码都很简单且常见──所以接下来我们会重点关注和 Permissions API 有关的代码，如果你想学习其他部分，请自行阅读。
+你可以[在线运行示例](https://chrisdavidmills.github.io/location-finder-permissions-api/)，或[在 Github 查看源代码](https://github.com/chrisdavidmills/location-finder-permissions-api/tree/gh-pages)。大部分代码都很简单且常见──所以接下来我们会重点关注和权限 API 有关的代码，如果你想学习其他部分，请自行阅读。
 
-### 访问 Permissions API
+### 访问权限 API
 
-浏览器现已包含 {{domxref("Navigator.permissions")}} 属性使开发者可以访问全局的 {{domxref("Permissions")}} 对象。这个对象最终将包含用来查询、申请和重置权限的方法，尽管，目前只有 {{domxref("Permissions.query()")}}; 我们接下来会讨论它。
+浏览器现已包含 {{domxref("Navigator.permissions")}} 属性使开发者可以访问全局的 {{domxref("Permissions")}} 对象。这个对象最终将包含用来查询、申请和撤销权限的方法，尽管，目前只有 {{domxref("Permissions.query()")}}；我们接下来会讨论它。
 
 ### 查询权限状态
 
-在我们的例子中，权限功能使用一个函数来处理— `handlePermission()`. 它开始于使用 {{domxref("Permissions.query()")}} 查询权限状态。根据 Promise resolve 后返回的 {{domxref("PermissionStatus")}} 对象的 {{domxref("PermissionStatus.state", "state")}} 属性，做出不同的处理：
+在我们的例子中，权限功能使用一个函数来处理——`handlePermission()`。它开始于使用 {{domxref("Permissions.query()")}} 查询权限状态。根据 Promise 兑现后返回的 {{domxref("PermissionStatus")}} 对象的 {{domxref("PermissionStatus.state", "state")}} 属性，做出不同的处理：
 
 - `"granted"`
-  - : "Enable Geolocation" 按钮被隐藏掉了，因为 Geolocation 已经被允许了，不需要这个按钮了。
+  - : “Enable Geolocation”按钮被隐藏掉了，因为 Geolocation 已经被允许了，不需要这个按钮了。
 - `"prompt"`
-  - : 隐藏 "Enable Geolocation" 按钮，因为用户会被（浏览器）引导授权 Geolocation 权限，所以它不需要了。接下来 {{domxref("Geolocation.getCurrentPosition()")}} 函数会运行，它会引导用户授权；如果用户授权了，它会继续执行 `revealPosition()` 函数（会显示地图）；如果用户拒绝了， `positionDenied()` 函数会被执行（这会让 "Enable Geolocation" 按钮显示出来）。
+  - : 隐藏“Enable Geolocation”按钮，因为用户会被（浏览器）引导授权 Geolocation 权限，所以它不需要了。接下来 {{domxref("Geolocation.getCurrentPosition()")}} 函数会运行，它会引导用户授权；如果用户授权了，它会继续执行 `revealPosition()` 函数（会显示地图）；如果用户拒绝了， `positionDenied()` 函数会被执行（这会让“Enable Geolocation”按钮显示出来）。
 - `"denied"`
-  - : "Enable Geolocation" 按钮会被显示（这段代码也需要放在这里，以防在页面首次加载时，这个源的权限状态就已经被设置为拒绝了）。
+  - : “Enable Geolocation”按钮会显示（这段代码也需要放在这里，以防在页面首次加载时，这个源的权限状态就已经被设置为拒绝了）。
 
 ```js
 function handlePermission() {
@@ -79,42 +77,8 @@ handlePermission();
 
 ### 权限描述符
 
-{{domxref("Permissions.query()")}} 方法接受一个 `PermissionDescriptor` 字典作为参数 — 它包含你感兴趣的 API 的名称。一些 API 有继承自默认的 `PermissionDescriptor` 的更加复杂的 `PermissionDescriptor`s 以包含更多额外的信息。例如，`PushPermissionDescriptor` 也包含一个比尔值指定 [`userVisibleOnly`](/zh-CN/docs/Web/API/PushManager/subscribe#Parameters) 是 `true` 还是 `false`.
-
-### 重置权限
-
-从 Firefox 47 开始，你可以使用 {{domxref("Permissions.revoke()")}} 方法重置现有权限。它的调用方式和 {{domxref("Permissions.query()")}} 方法几乎一模一样，区别是，当 promise 成功 resolve 时，它会让一个现有的权限恢复默认状态（通常是 `prompt`）。让我们看看 demo 中的代码：
-
-```js
-const revokeBtn = document.querySelector(".revoke");
-
-// ...
-
-revokeBtn.onclick = () => {
-  revokePermission();
-};
-
-// ...
-
-function revokePermission() {
-  navigator.permissions.revoke({ name: "geolocation" }).then((result) => {
-    report(result.state);
-  });
-}
-```
-
-> [!NOTE]
-> 自 Firefox 51 开始 `revoke()` 函数被默认关闭了，因为它的设计带来了 [Web Applications Security Working Group](https://www.w3.org/2011/webappsec/) 中提到的问题。可以通过将设置项 `dom.permissions.revoke.enable` 置为 `true` 来重新开启它。
+{{domxref("Permissions.query()")}} 方法接受一个 `PermissionDescriptor` 字典作为参数——它包含你感兴趣的 API 的名称。一些 API 有更复杂的 `PermissionDescriptor` 结构，该结构继承自默认的 `PermissionDescriptor`，包含更多额外的信息。例如，`PushPermissionDescriptor` 也包含一个布尔值指定 [`userVisibleOnly`](/zh-CN/docs/Web/API/PushManager/subscribe#参数) 是 `true` 还是 `false`。
 
 ### 响应权限状态变化
 
 你会注意到，在上面的代码中，在 {{domxref("PermissionStatus")}} 对象上有一个 `onchange` 事件回调——这让我们可以对感兴趣的 API 的状态变化做出响应。目前，我们只是上报了状态的变化。
-
-## 总结和展望未来
-
-目前，较之我们已有的，这个 API 并没有提供太多额外内容。如果在浏览器询问时，我们选择了从不分享我们的位置，那么不使用浏览器菜单选项的话，我们将无法返回权限的初始状态（询问）：
-
-- **Firefox**：_工具 > 页面信息 > 权限 > 访问你的位置_。选择“总是询问”。
-- **Chrome**：_汉堡菜单 > 设置 > 显示高级设置。在隐私部分，点击“内容设置”。在出现的对话框中，找到“位置”部分，选择“当网站试图访问时询问”...最后，点击“管理特例”_，移除你对特定网站的授权。
-
-但是，未来浏览器会提供 `request()` 方法，他让我们可以在任何时候以编程的方式来请求权限。这非常值得期待尽快被实现。
diff --git a/files/zh-cn/web/api/workernavigator/permissions/index.md b/files/zh-cn/web/api/workernavigator/permissions/index.md
index 619af770994cb1..3d504d2b557941 100644
--- a/files/zh-cn/web/api/workernavigator/permissions/index.md
+++ b/files/zh-cn/web/api/workernavigator/permissions/index.md
@@ -2,10 +2,10 @@
 title: WorkerNavigator：permissions 属性
 slug: Web/API/WorkerNavigator/permissions
 l10n:
-  sourceCommit: ee253ac58d71b2ed336b705ab97dbe93122b3e04
+  sourceCommit: e8fe043f7d2ad7cd9804d1bf96e0310949f1dac7
 ---
 
-{{APIRef("Permissions API")}}
+{{APIRef("Permissions API")}}{{AvailableInWorkers("worker")}}
 
 {{domxref("WorkerNavigator")}} 接口的 **`permissions`** 只读属性返回一个 {{domxref("Permissions")}} 对象，可以用于查询或更新 [Permissions API](/zh-CN/docs/Web/API/Permissions_API) 涵盖的 API 权限状态。
 

From aacc5a1087fe1bddf387f5dec8954aba3c5ce7c9 Mon Sep 17 00:00:00 2001
From: Hoarfroster <hoarfroster@outlook.com>
Date: Mon, 30 Sep 2024 09:16:46 +0800
Subject: [PATCH 43/43] zh-CN: create `extension` (#23533)

Co-authored-by: Jason Ren <40999116+jasonren0403@users.noreply.github.com>
---
 .../webextensions/api/extension/index.md      | 89 +++++++++++++++++++
 1 file changed, 89 insertions(+)
 create mode 100644 files/zh-cn/mozilla/add-ons/webextensions/api/extension/index.md

diff --git a/files/zh-cn/mozilla/add-ons/webextensions/api/extension/index.md b/files/zh-cn/mozilla/add-ons/webextensions/api/extension/index.md
new file mode 100644
index 00000000000000..a7c39bd392a4e4
--- /dev/null
+++ b/files/zh-cn/mozilla/add-ons/webextensions/api/extension/index.md
@@ -0,0 +1,89 @@
+---
+title: extension
+slug: Mozilla/Add-ons/WebExtensions/API/extension
+l10n:
+  sourceCommit: b8a0743ca8b1e1b1b1a95cc93a4413c020f11262
+---
+
+{{AddonSidebar}}
+
+有关插件的工具；获取你的插件的资源包的 URL；获取你的插件页面的 [`Window`](/zh-CN/docs/Web/API/Window) 对象；获取各种设置的值。
+
+> **备注：** **该模块中的消息 API 被弃用**，取而代之的是 [`runtime`](/zh-CN/docs/Mozilla/Add-ons/WebExtensions/API/runtime) 模块中相应的 API。
+
+## 类型
+
+- {{WebExtAPIRef("extension.ViewType")}}
+  - : 用于指定要获取的视图类型的字符串。
+
+## 属性
+
+- {{WebExtAPIRef("extension.lastError")}} {{deprecated_inline}}
+  - : 如果异步扩展 API 中出现错误，将在回调的调用中将该属性设置为那一错误。若没有发生错误，`lastError` 将为 {{jsxref("undefined")}}。
+- {{WebExtAPIRef("extension.inIncognitoContext")}}
+  - : 对在隐身模式标签中运行的内容脚本、在隐身模式进程中运行的扩展页面返回 `true`。（仅适用于 `incognito_behavior` 取值为“`split`”的扩展。）
+
+## 函数
+
+- {{WebExtAPIRef("extension.getBackgroundPage()")}}
+  - : 返回当前扩展内运行的后台页面的 [`Window`](/zh-CN/docs/Web/API/Window) 对象。如果扩展不存在后台页面，则返回 [`null`](/zh-CN/docs/Web/JavaScript/Reference/Operators/null)。
+- {{WebExtAPIRef("extension.getExtensionTabs()")}} {{deprecated_inline}}
+  - : 返回当前扩展内运行的每个标签的 JavaScript [`Window`](/zh-CN/docs/Web/API/Window) 对象的数组。
+- {{WebExtAPIRef("extension.getURL()")}} {{deprecated_inline}}
+  - : 将扩展安装目录内的相对路径转换为完全限定的 URL。
+- {{WebExtAPIRef("extension.getViews()")}}
+  - : 返回当前扩展内运行的每个页面的 [`Window`](/zh-CN/docs/Web/API/Window) 对象的数组。
+- {{WebExtAPIRef("extension.isAllowedIncognitoAccess()")}}
+  - : 获取扩展对隐身模式的访问权限的状态（由用户控制的“_允许在隐身模式中_”复选框确定）。
+- {{WebExtAPIRef("extension.isAllowedFileSchemeAccess()")}}
+  - : 获取扩展对 `file://` 协议的访问权限的状态（由用户控制的“_允许访问文件 URL_”复选框确定）。
+- {{WebExtAPIRef("extension.sendRequest()")}} {{deprecated_inline}}
+  - : 发送单一请求到扩展中的其他监听器。
+- {{WebExtAPIRef("extension.setUpdateUrlData()")}}
+  - : 设置扩展的更新 URL 中使用的 ap CGI 参数的值。对于托管在浏览器供应商商店中的扩展，此值将被忽略。
+
+## 事件
+
+- {{WebExtAPIRef("extension.onRequest")}} {{deprecated_inline}}
+  - : 当从扩展进程或内容脚本发送请求时触发。
+- {{WebExtAPIRef("extension.onRequestExternal")}} {{deprecated_inline}}
+  - : 当从另一个扩展发送请求时触发。
+
+## 浏览器兼容性
+
+{{Compat}}
+
+{{WebExtExamples("h2")}}
+
+> [!NOTE]
+> 此 API 基于 Chromium 的 [`chrome.extension`](https://developer.chrome.com/docs/extensions/reference/api/extension/) API。该文档衍生自 Chromium 代码中的 [`extension.json`](https://chromium.googlesource.com/chromium/src/+/master/chrome/common/extensions/api/extension.json)。
+
+<!--
+// Copyright 2015 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+-->