The HTML srclang attribute specifies the language of the text track data within a <track> element.
Definition and Usage
➔ The srclang attribute is primarily used to provide subtitles with the <audio> and <video> media elements.
➔ If the kind attribute is set to "subtitles", the srclang attribute is required.
Syntax
//In HTML
<video id="myVideo" controls="controls">
<source src="video-path" type="video_type">
<track src="subtitle_en.vtt" kind="subtitles" srclang="en" label="English">
<track src="subtitle_fr.vtt" kind="subtitles" srclang="fr" label="French">
<track src="subtitle_es.vtt" kind="subtitles" srclang="es" label="Spanish">
Your browser does not support the video tag.
</video>
//In JavaScript
let element = document.querySelector("#myVideo");
element.srclang = "fr";
element.src = "subtitle_fr.vtt";
//Or
element.setAttribute("srclang", "fr");
element.setAttribute("src", "subtitle_fr.vtt");
Example
<!DOCTYPE html>
<html>
<head>
<title>HTML srclang attribute example</title>
</head>
<body>
<h3>HTML srclang attribute example</h3>
<p>The srclang attribute specifies the language of the text track data</p>
<section>
<video id="myVideo" controls="controls">
<source src="video-path" type="video_type">
<track src="subtitle_en.vtt" kind="subtitles" srclang="en" label="English">
<track src="subtitle_fr.vtt" kind="subtitles" srclang="fr" label="French">
<track src="subtitle_es.vtt" kind="subtitles" srclang="es" label="Spanish">
Your browser does not support the video tag.
</video>
</section>
</body>
</html>
Click on the "Try it Now" button to see how it works.