<track>: El elemento pista de texto incrustado
==============================================

El elemento HTML **`<track>`** se utiliza como elemento hijo de los elementos multimedia, `<audio>` y `<video>`. Le permite especificar pistas de texto cronometradas (o datos basados en el tiempo), por ejemplo, para manejar subtítulos automáticamente. Las pistas están formateadas en formato WebVTT (en-US) (archivos `.vtt`): *Web Video Text Tracks* (pistas de texto de video web).

Pruébalo
--------

|  |  |
| --- | --- |
| Categorías de contenido | Ninguno |
| Contenido permitido | Ninguno, es un elemento vacío |
| Omisión de la etiqueta | 
 Como es un elemento vacío, la etiqueta de inicio debe estar presente y
 no debe tener la etiqueta de cierre.
  |
| Padres permitidos | 
 Un elemento multimedia, `<audio>` o
 `<video>`.
  |
| Rol ARIA implícito | Sin rol correspondiente |
| Roles ARIA permitidos | No se permite `role` |
| Interfaz DOM | `HTMLTrackElement` (en-US) |

Atributos
---------

Este elemento incluye los atributos globales.

`default`

Este atributo indica que la pista debe habilitarse a menos que las preferencias del usuario indiquen que otra pista es más apropiada. Esto solo se puede usar en un elemento `track` por elemento multimedia.

`kind`

Cómo debe usarse la pista de texto. Si se omite, el tipo predeterminado es `subtitles`. Si el atributo contiene un valor no válido, utilizará `metadata` (las versiones de Chrome anteriores a la 52 trataron un valor no válido como `subtitles`). Se permiten las siguientes palabras clave:

* `subtitles`
    + Los subtítulos proporcionan traducción de contenido que el espectador no puede entender. Por ejemplo, habla o texto que no está en inglés en una película en inglés.
    + Los subtítulos pueden contener contenido adicional, generalmente información de fondo adicional. Por ejemplo, el texto al comienzo de las películas de Star Wars, o la fecha, la hora y la ubicación de una escena.
* `captions`
    + Los subtítulos ofrecen una transcripción y posiblemente una traducción del audio.
    + Puede incluir información no verbal importante, como pistas musicales o efectos de sonido. Puede indicar la fuente de la señal (por ejemplo, música, texto, personaje).
    + Adecuado para usuarios sordos o cuando el sonido está silenciado.
* `descriptions`
    + Descripción textual del contenido del video.
    + Apto para usuarios ciegos o cuando no se puede ver el vídeo.
* `chapters`
    + Los títulos de los capítulos están destinados a ser utilizados cuando el usuario navega por el recurso multimedia.
* `metadata`
    + Pistas utilizadas por los *scripts*. No visible para el usuario.

`label`

Un título legible por el usuario de la pista de texto que utiliza el navegador cuando enumera las pistas de texto disponibles.

`src`

Dirección de la pista (archivo `.vtt`). Debe ser una URL válida. Este atributo debe especificarse y su valor de URL debe tener el mismo origen que el documento, a menos que el elemento principal `<audio>` o `<video>` del elemento `track` tenga un atributo de origen cruzado.

`srclang`

Idioma del texto de la pista. Debe ser una etiqueta de idioma BCP 47 válida. Si el atributo `kind` se establece en `subtitles`, se debe definir `srclang`.

Notas de uso
------------

### Tipos de datos de pista

El tipo de datos que `track` agrega a los medios se establece en el atributo `kind`, que puede tomar valores de `subtitles`, `captions`, `descriptions`, `chapters` o `metadata`. El elemento apunta a un archivo de origen que contiene texto cronometrado que el navegador expone cuando el usuario solicita datos adicionales.

Un elemento multimedia no puede tener más de un `track` con el mismo `kind`, `srclang` y `label`.

### Detectar cambios de señal

El `TextTrack` subyacente, indicado por la propiedad `track`, recibe un evento `cuechange` cada vez que se cambia la señal actual. Esto sucede incluso si la pista no está asociada con un elemento multimedia.

Si la pista *está* asociada con un elemento de medios, usando el elemento `<track>` como elemento hijo del elemento `<audio>` o `<video>`, el evento `cuechange` también se envía a `HTMLTrackElement` (en-US).


```js
let textTrackElem = document.getElementById("texttrack");

textTrackElem.addEventListener("cuechange", (event) => {
  let cues = event.target.track.activeCues;
});
```

Ejemplos
--------


```html
<video controls poster="/images/sample.gif">
  <source src="sample.mp4" type="video/mp4" />
  <source src="sample.ogv" type="video/ogv" />
  <track kind="captions" src="sampleCaptions.vtt" srclang="en" />
  <track kind="descriptions" src="sampleDescriptions.vtt" srclang="en" />
  <track kind="chapters" src="sampleChapters.vtt" srclang="en" />
  <track kind="subtitles" src="sampleSubtitles\_de.vtt" srclang="de" />
  <track kind="subtitles" src="sampleSubtitles\_en.vtt" srclang="en" />
  <track kind="subtitles" src="sampleSubtitles\_ja.vtt" srclang="ja" />
  <track kind="subtitles" src="sampleSubtitles\_oz.vtt" srclang="oz" />
  <track kind="metadata" src="keyStage1.vtt" srclang="en" label="Key Stage 1" />
  <track kind="metadata" src="keyStage2.vtt" srclang="en" label="Key Stage 2" />
  <track kind="metadata" src="keyStage3.vtt" srclang="en" label="Key Stage 3" />
  <!-- Fallback -->
  ...
</video>
```

Especificaciones
----------------

| Specification |
| --- |
| HTML Standard # the-track-element |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Véase también
-------------

* Formato de pista de texto WebVTT (en-US)
* `HTMLMediaElement.textTracks` (en-US)