Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[zh-cn]: update translation for HTMLMediaElement #23712

Merged
merged 4 commits into from
Sep 21, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
51 changes: 23 additions & 28 deletions files/zh-cn/web/api/htmlmediaelement/abort_event/index.md
Original file line number Diff line number Diff line change
@@ -1,43 +1,38 @@
---
title: "HTMLMediaElement: abort event"
title: HTMLMediaElementabort 事件
slug: Web/API/HTMLMediaElement/abort_event
l10n:
sourceCommit: 595cba0e07c70eda7f08a12890e00ea0281933d3
---

{{APIRef}}

资源没有被完全加载时就会触发 **`abort`** 事件,但错误不会触发该事件。

<table class="properties">
<tbody>
<tr>
<th scope="row">Bubbles</th>
<td>No</td>
</tr>
<tr>
<th scope="row">Cancelable</th>
<td>No</td>
</tr>
<tr>
<th scope="row">Interface</th>
<td>{{domxref("Event")}}</td>
</tr>
<tr>
<th scope="row">Event handler property</th>
<td>
{{domxref("GlobalEventHandlers/onabort", "onabort")}}
</td>
</tr>
</tbody>
</table>
**`abort`** 事件会在资源没有被完全加载时触发,但错误不会触发该事件。

此事件无法被取消也不会冒泡。

## 语法

在类似 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 的方法中使用此事件名,或者设置事件处理器属性。

```js
addEventListener("abort", (event) => {});

onabort = (event) => {};
```

## 事件类型

通用 {{domxref("Event")}}。

## 示例

```js
const video = document.querySelector("video");
const videoSrc = "https://path/to/video.webm";
const videoSrc = "https://example.org/path/to/video.webm";

video.addEventListener("abort", () => {
console.log(`Abort loading: ${videoSrc}`);
console.log(`加载中止:${videoSrc}`);
});

const source = document.createElement("source");
Expand All @@ -55,7 +50,7 @@ video.appendChild(source);

{{Compat}}

## 参阅
## 参见

- {{domxref("HTMLAudioElement")}}
- {{domxref("HTMLVideoElement")}}
Expand Down
43 changes: 28 additions & 15 deletions files/zh-cn/web/api/htmlmediaelement/audiotracks/index.md
Original file line number Diff line number Diff line change
@@ -1,35 +1,46 @@
---
title: HTMLMediaElement.audioTracks
title: HTMLMediaElementaudioTracks 属性
slug: Web/API/HTMLMediaElement/audioTracks
l10n:
sourceCommit: 595cba0e07c70eda7f08a12890e00ea0281933d3
---

{{APIRef("HTML DOM")}}

**`HTMLMediaElement.audioTracks`** 获得可用音频轨道的数量
{{domxref("HTMLMediaElement")}} 对象的只读属性 **`audioTracks`** 返回一个 {{domxref("AudioTrackList")}} 对象,该对象列出了所有表示媒体元素音频轨道的 {{domxref("AudioTrack")}} 对象。

## 语法
媒体元素可能是一个 {{HTMLElement("audio")}} 元素或 {{HTMLElement("video")}} 元素。

```plain
audio|video.audioTracks
```
所返回的列表是*动态的*;即,当音频轨道从媒体元素上增加或删除时,列表的内容将会动态的变化。一旦你引用了该列表,你可以监控它以检测何时添加了新的音轨或删除了已存在的音轨。参阅 [AudioTrackList 事件](/zh-CN/docs/Web/API/AudioTrackList#事件)以了解更多有关获取媒体元素音轨列表变化的信息。

## 返回值

AudioTrackList 对象 表示音频/视频的可用音频轨道
一个 {{domxref("AudioTrackList")}} 对象,表示一个媒体元素中所包含的音频轨道的列表。音轨列表可以使用数组表示法或对象的 {{domxref("AudioTrackList.getTrackById", "getTrackById()")}} 方法访问。

每个音轨都是由一个提供音轨信息的 {{domxref("AudioTrack")}} 对象表示的。

## 示例

## 用例
在这个示例中,给定元素的所有的音频轨道都是被静音的。

以 audio 标签为例
### HTML

构建元素本身的 HTML。

```html
<audio id="audio"></audio>
<video id="video" src="somevideo.mp4"></video>
```

调用
### JavaScript

这段 JavaScript 代码负责将视频元素的音轨静音。

```js
const video = document.getElementById("video");

```plain
myVid=document.getElementById("audio");
alert(myVid.audioTracks.length);
for (let i = 0; i < video.audioTracks.length; i += 1) {
video.audioTracks[i].enabled = false;
}
```

## 规范
Expand All @@ -42,4 +53,6 @@ alert(myVid.audioTracks.length);

## 参见

- 定义它的接口,{{domxref("HTMLMediaElement")}}。
- {{domxref("HTMLMediaElement")}}:用于定义 `HTMLMediaElement.audioTracks` 属性的接口
- {{HTMLElement("audio")}}、{{HTMLElement("video")}}
- {{domxref("AudioTrack")}}、{{domxref("AudioTrackList")}}
21 changes: 7 additions & 14 deletions files/zh-cn/web/api/htmlmediaelement/buffered/index.md
Original file line number Diff line number Diff line change
@@ -1,24 +1,17 @@
---
title: HTMLMediaElement.buffered
title: HTMLMediaElementbuffered 属性
slug: Web/API/HTMLMediaElement/buffered
l10n:
sourceCommit: 2b554506d84d016d3ddf612c593bd8315833c64d
---

{{APIRef("HTML DOM")}}

**`HTMLMediaElement.buffered`** 返回一个只读 {{domxref("TimeRanges")}} 对象 返回媒体已缓冲的区域
{{domxref("HTMLMediaElement")}} 对象的只读属性 **`buffered`** 返回一个新的静态[规范化 `TimeRanges` 对象](/zh-CN/docs/Web/API/TimeRanges#规范化的_timeranges_对象),该对象表示用户代理在访问 `buffered` 属性时已缓冲的媒体资源(如果有)的范围。

> [!NOTE]
> This feature is not available in [Web Workers](/zh-CN/docs/Web/API/Web_Workers_API).
## 返回值

## 值

对象{{domxref("TimeRanges")}}

length - 获得音频/视频中已缓冲范围的数量

buffered.start 开始的区域

buffered.end 结束的区域
一个新的静态[规范化 `TimeRanges` 对象](/zh-CN/docs/Web/API/TimeRanges#规范化的_timeranges_对象),表示用户代理在访问 `buffered` 属性时已缓冲的媒体资源(如果有)的范围。

## 示例

Expand All @@ -37,4 +30,4 @@ console.log(obj.buffered); // TimeRanges { length: 0 }

## 参见

- The interface defining it, {{domxref("HTMLMediaElement")}}.
- {{domxref("HTMLMediaElement")}}:用于定义 `HTMLMediaElement.buffered` 属性的接口
93 changes: 41 additions & 52 deletions files/zh-cn/web/api/htmlmediaelement/canplay_event/index.md
Original file line number Diff line number Diff line change
@@ -1,52 +1,41 @@
---
title: "HTMLMediaElement: canplay"
title: HTMLMediaElementcanplay 事件
slug: Web/API/HTMLMediaElement/canplay_event
l10n:
sourceCommit: b71d118ffc6d72b77efad9661110fcc9ede464eb
---

{{APIRef("HTMLMediaElement")}}

`canplay` 事件在终端可以播放媒体文件时(但估计还没有加载足够的数据来播放媒体直到其结束,即后续可能需要停止以进一步缓冲内容)被触发。

<table class="properties">
<tbody>
<tr>
<th scope="row">是否冒泡</th>
<td>否</td>
</tr>
<tr>
<th scope="row">是否可取消</th>
<td>否</td>
</tr>
<tr>
<th scope="row">接口</th>
<td>{{DOMxRef("Event")}}</td>
</tr>
<tr>
<th scope="row">目标</th>
<td>元素</td>
</tr>
<tr>
<th scope="row">默认行为</th>
<td>无</td>
</tr>
<tr>
<th scope="row">事件处理器属性</th>
<td>{{domxref("GlobalEventHandlers.oncanplay")}}</td>
</tr>
</tbody>
</table>
**`canplay`** 事件会在用户代理可以播放媒体,但是估计没有加载足够的数据以流畅地播放媒体至结束(可能需要停顿来缓存更多内容)时触发。

此事件无法被取消也不会冒泡。

## 语法

在类似 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 的方法中使用事件名,或者设置事件处理器属性。

```js
addEventListener("canplay", (event) => {});

oncanplay = (event) => {};
```

## 事件类型

通用 {{domxref("Event")}}。

## 示例

以下示例展示了如何为媒体元素的 `canplay` 事件添加一个事件监听器,以在该事件触发时发送一条消息
这些示例为 HTMLMediaElement 的 `canplay` 事件添加了一个事件监听器。事件处理器会在事件被触发时发送一条信息

使用 `addEventListener()`:

```js
const video = document.querySelector("video");

video.addEventListener("canplay", (event) => {
console.log("Video can start, but not sure it will play through.");
console.log("视频可以开始播放,但是不一定能够完整地播放。");
});
```

Expand All @@ -56,7 +45,7 @@ video.addEventListener("canplay", (event) => {
const video = document.querySelector("video");

video.oncanplay = (event) => {
console.log("Video can start, but not sure it will play through.");
console.log("视频可以开始播放,但是不一定能够完整地播放。");
};
```

Expand All @@ -70,24 +59,24 @@ video.oncanplay = (event) => {

## 相关事件

- 媒体元素 {{domxref("HTMLMediaElement.playing_event", 'playing')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.waiting_event", 'waiting')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.seeking_event", 'seeking')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.seeked_event", 'seeked')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.ended_event", 'ended')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.loadedmetadata_event", 'loadedmetadata')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.loadeddata_event", 'loadeddata')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.canplay_event", 'canplay')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.canplaythrough_event", 'canplaythrough')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.durationchange_event", 'durationchange')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.timeupdate_event", 'timeupdate')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.play_event", 'play')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.pause_event", 'pause')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.ratechange_event", 'ratechange')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.volumechange_event", 'volumechange')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.suspend_event", 'suspend')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.emptied_event", 'emptied')}} 事件
- 媒体元素 {{domxref("HTMLMediaElement.stalled_event", 'stalled')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.playing_event", 'playing')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.waiting_event", 'waiting')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.seeking_event", 'seeking')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.seeked_event", 'seeked')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.ended_event", 'ended')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.loadedmetadata_event", 'loadedmetadata')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.loadeddata_event", 'loadeddata')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.canplay_event", 'canplay')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.canplaythrough_event", 'canplaythrough')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.durationchange_event", 'durationchange')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.timeupdate_event", 'timeupdate')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.play_event", 'play')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.pause_event", 'pause')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.ratechange_event", 'ratechange')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.volumechange_event", 'volumechange')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.suspend_event", 'suspend')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.emptied_event", 'emptied')}} 事件
- HTMLMediaElement {{domxref("HTMLMediaElement.stalled_event", 'stalled')}} 事件

## 参见

Expand Down