[zh-cn]: sync translation for FileReader.{abort(), abort, load} (#20359)

Author: skyclouds2001

files/zh-cn/web/api/filereader/abort/index.md

@@ -1,22 +1,27 @@
 ---
-title: FileReader.abort()
+title: FileReader：abort() 方法
 slug: Web/API/FileReader/abort
+l10n:
+  sourceCommit: e43bfd9b4a6c363a4ba7ef6ffa64c09b38fd111b
 ---
 
-{{APIRef("File API")}}
+{{APIRef("File API")}}{{AvailableInWorkers}}
 
-该方法可以取消 FileReader 的读取操作，触发之后 {{domxref("FileReader.readyState","readyState")}} 为已完成（DONE）。
+{{domxref("FileReader")}} 接口的 **`abort()`** 方法中止读取操作。返回后，{{domxref("FileReader.readyState","readyState")}} 将为 `DONE`。
 
 ## 语法
 
-```plain
-instanceOfFileReader.abort();
+```js-nolint
+abort()
 ```
 
-### 例外情况
+### 参数
 
-- `DOM_FILE_ABORT_ERR`
-  - : 对一个没有正在进行读取操作（{{domxref("FileReader.readyState","readyState")}} 不是 `LOADING`）的 `FileReader` 进行 `abort` 操作，会抛出 `DOM_FILE_ABORT_ERR` 错误。
+无。
+
+### 返回值
+
+无（{{jsxref("undefined")}}）。
 
 ## 规范
 

files/zh-cn/web/api/filereader/abort_event/index.md

@@ -2,18 +2,18 @@
 title: FileReader：abort 事件
 slug: Web/API/FileReader/abort_event
 l10n:
-  sourceCommit: 497d322c61511b11e4877a77660f8d7b394a8277
+  sourceCommit: e43bfd9b4a6c363a4ba7ef6ffa64c09b38fd111b
 ---
 
 {{APIRef("File API")}}{{AvailableInWorkers}}
 
-**`abort`** 事件会在读取操作被中止时触发：例如，当程序调用了 {{domxref("FileReader.abort()")}} 方法。
+{{domxref("FileReader")}} 接口的 **`abort`** 事件在读取被中止时触发：例如因为程序调用了 {{domxref("FileReader.abort()")}} 方法。
 
 此事件不可取消且不会冒泡。
 
 ## 语法
 
-在类似 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 这样的方法中使用事件名称，或设置事件处理器属性。
+在 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 等方法中使用事件名称，或设置事件处理器属性。
 
 ```js
 addEventListener("abort", (event) => {});
@@ -23,31 +23,31 @@ onabort = (event) => {};
 
 ## 事件类型
 
-{{domxref("ProgressEvent")}}。继承于 {{domxref("Event")}}。
+{{domxref("ProgressEvent")}}。继承自 {{domxref("Event")}}。
 
 {{InheritanceDiagram("ProgressEvent")}}
 
 ## 事件属性
 
-_该属性也继承了其父类 {{domxref("Event")}} 的属性_。
+_还继承其父级 {{domxref("Event")}} 的属性。_
 
 - {{domxref("ProgressEvent.lengthComputable")}} {{ReadOnlyInline}}
-  - : 一个布尔标志，表示底层进程要完成的总工作量及已完成的工作量是否可计算。换句话说，它表明进度是否可以衡量。
+  - : 一个布尔标志，指示底层进程要完成的总工作量以及已完成的工作量是否可计算。换句话说，它表明进展是否可衡量。
 - {{domxref("ProgressEvent.loaded")}} {{ReadOnlyInline}}
-  - : 一个 64 位无符号整数值，表示底层进程已完成的工作量。完成工作的比例可以通过除以 `total` 属性的值来计算。当使用 HTTP 下载资源时，这仅计算 HTTP 消息的主体的大小，并且不包括标头以及其他开销。
+  - : 一个 64 位无符号整数值，指示底层进程已执行的工作量。完成工作的比率可以通过将 `total` 除以该属性的值来计算。使用 HTTP 下载资源时，仅计算 HTTP 消息的正文，不包括标头和其他开销。
 - {{domxref("ProgressEvent.total")}} {{ReadOnlyInline}}
-  - : 一个 64 位无符号整数，表示底层进程正在执行的总工作量。当使用 HTTP 下载资源时，这是 `Content-Length`（消息体的大小），并且不包括标头以及其他开销。
+  - : 一个 64 位无符号整数，表示底层进程正在执行的工作总量。使用 HTTP 下载资源时，这是 `Content-Length`（消息正文的大小），不包括标头和其他开销。
 
 ## 示例
 
-### 在线示例
+### 实时示例
 
 #### HTML
 
 ```html
 <div class="example">
   <div class="file-select">
-    <label for="avatar">选择你的头像：</label>
+    <label for="avatar">选择个人资料图片：</label>
     <input
       type="file"
       id="avatar"
@@ -58,7 +58,7 @@ _该属性也继承了其父类 {{domxref("Event")}} 的属性_。
   <img src="" class="preview" height="200" alt="图片预览" />
 
   <div class="event-log">
-    <label for="eventLog">事件输出：</label>
+    <label for="eventLog">事件日志：</label>
     <textarea readonly class="event-log-contents" id="eventLog"></textarea>
   </div>
 </div>
@@ -111,7 +111,7 @@ const eventLog = document.querySelector(".event-log-contents");
 const reader = new FileReader();
 
 function handleEvent(event) {
-  eventLog.textContent += `${event.type}：传输了 ${event.loaded} 个字节\n`;
+  eventLog.textContent += `${event.type}：传输了 ${event.loaded} 字节\n`;
 
   if (event.type === "load") {
     preview.src = reader.result;
@@ -142,7 +142,7 @@ fileInput.addEventListener("change", handleSelected);
 
 #### 结果
 
-{{ EmbedLiveSample('在线示例', '100%', '300px') }}
+{{ EmbedLiveSample('实时示例', '100%', '300px') }}
 
 ## 规范
 
@@ -154,4 +154,4 @@ fileInput.addEventListener("change", handleSelected);
 
 ## 参见
 
-- 相关事件：{{domxref("FileReader.loadstart_event", "loadstart")}}、{{domxref("FileReader.loadend_event", "loadend")}}、{{domxref("FileReader.progress_event", "progress")}}、{{domxref("FileReader.error_event", "error")}}、{{domxref("FileReader.load_event", "load")}}。
+- 相关事件：{{domxref("FileReader.loadstart_event", "loadstart")}}、{{domxref("FileReader.loadend_event", "loadend")}}、{{domxref("FileReader.progress_event", "progress")}}、{{domxref("FileReader.error_event", "error")}}、{{domxref("FileReader.load_event", "load")}}

files/zh-cn/web/api/filereader/load_event/index.md

@@ -1,55 +1,65 @@
 ---
-title: "FileReader: load event"
+title: FileReader：load 事件
 slug: Web/API/FileReader/load_event
+l10n:
+  sourceCommit: e43bfd9b4a6c363a4ba7ef6ffa64c09b38fd111b
 ---
 
-{{APIRef}}
-
-当文件成功读取时，执行`load` 事件
-
-<table class="properties">
-  <tbody>
-    <tr>
-      <th scope="row">是否冒泡</th>
-      <td>No</td>
-    </tr>
-    <tr>
-      <th scope="row">是否能中断退出</th>
-      <td>No</td>
-    </tr>
-    <tr>
-      <th scope="row">调用接口</th>
-      <td>{{domxref("ProgressEvent")}}</td>
-    </tr>
-    <tr>
-      <th scope="row">事件处理属性</th>
-      <td>{{domxref("FileReader.onload")}}</td>
-    </tr>
-  </tbody>
-</table>
-
-## 例子
-
-### Live example
+{{APIRef("File API")}}{{AvailableInWorkers}}
+
+{{domxref("FileReader")}} 接口的 **`load`** 事件在成功读取文件时触发。
+
+此事件不可取消且不会冒泡。
+
+## 语法
+
+在 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 等方法中使用事件名称，或设置事件处理器属性。
+
+```js
+addEventListener("load", (event) => {});
+
+onload = (event) => {};
+```
+
+## 事件类型
+
+{{domxref("ProgressEvent")}}。继承自 {{domxref("Event")}}。
+
+{{InheritanceDiagram("ProgressEvent")}}
+
+## 事件属性
+
+_还继承其父级 {{domxref("Event")}} 的属性。_
+
+- {{domxref("ProgressEvent.lengthComputable")}} {{ReadOnlyInline}}
+  - : 一个布尔标志，指示底层进程要完成的总工作量以及已完成的工作量是否可计算。换句话说，它表明进展是否可衡量。
+- {{domxref("ProgressEvent.loaded")}} {{ReadOnlyInline}}
+  - : 一个 64 位无符号整数值，指示底层进程已执行的工作量。完成工作的比率可以通过将 `total` 除以该属性的值来计算。使用 HTTP 下载资源时，仅计算 HTTP 消息的正文，不包括标头和其他开销。
+- {{domxref("ProgressEvent.total")}} {{ReadOnlyInline}}
+  - : 一个 64 位无符号整数，表示底层进程正在执行的工作总量。使用 HTTP 下载资源时，这是 `Content-Length`（消息正文的大小），不包括标头和其他开销。
+
+## 示例
+
+### 实时示例
 
 #### HTML
 
 ```html
 <div class="example">
   <div class="file-select">
-    <label for="avatar">Choose a profile picture:</label>
+    <label for="avatar">选择个人资料图片：</label>
     <input
       type="file"
       id="avatar"
       name="avatar"
       accept="image/png, image/jpeg" />
   </div>
 
-  <img src="" class="preview" height="200" alt="Image preview..." />
+  <img src="" class="preview" height="200" alt="图片预览" />
 
   <div class="event-log">
-    <label>Event log:</label>
-    <textarea readonly class="event-log-contents"></textarea>
+    <label for="eventLog">事件日志：</label>
+    <textarea readonly class="event-log-contents" id="eventLog"></textarea>
   </div>
 </div>
 ```
@@ -65,6 +75,7 @@ img.preview {
   border: 1px solid black;
   margin: 0.2rem;
   padding: 0.2rem;
+  resize: none;
 }
 
 .example {
@@ -89,13 +100,9 @@ img.preview {
 .event-log > label {
   display: block;
 }
-
-.event-log-contents {
-  resize: none;
-}
 ```
 
-#### JS
+#### JavaScript
 
 ```js
 const fileInput = document.querySelector('input[type="file"]');
@@ -104,8 +111,7 @@ const eventLog = document.querySelector(".event-log-contents");
 const reader = new FileReader();
 
 function handleEvent(event) {
-  eventLog.textContent =
-    eventLog.textContent + `${event.type}: ${event.loaded} bytes transferred\n`;
+  eventLog.textContent += `${event.type}：传输了 ${event.loaded} 字节\n`;
 
   if (event.type === "load") {
     preview.src = reader.result;
@@ -135,7 +141,7 @@ fileInput.addEventListener("change", handleSelected);
 
 #### 结果
 
-{{ EmbedLiveSample('Live_example', '100%', '300px') }}
+{{ EmbedLiveSample('实时示例', '100%', '300px') }}
 
 ## 规范
 
@@ -145,6 +151,6 @@ fileInput.addEventListener("change", handleSelected);
 
 {{Compat}}
 
-## 请参阅
+## 参见
 
-- Related events: {{domxref("FileReader.loadstart_event")}}, {{domxref("FileReader.loadend_event")}}, {{domxref("FileReader.progress_event")}}, {{domxref("FileReader.error_event")}}, {{domxref("FileReader.abort_event")}}
+- 相关事件：{{domxref("FileReader.loadstart_event", "loadstart")}}、{{domxref("FileReader.loadend_event", "loadend")}}、{{domxref("FileReader.progress_event", "progress")}}、{{domxref("FileReader.error_event", "error")}}、{{domxref("FileReader.abort_event", "abort")}}