I have a site with multiple video elements. I must add #t=0.1 to src="" of each video.
<div itemprop="video" itemscope itemtype="" class="seovid">
<object>
<video width="640" controls controlsList="nodownload">
<source src="/bla.mp4">
Dein Browser unterstützt keine HTML5 Videos oder Du nutzt eine veraltete Version.
</video>
</object>
<h3 itemprop="name“>bla</h3>
<p itemprop="description“>bla</p>
</div>
So I was looking around for hours now, finding things close to what I'm looking for but not working for me:
Jquery - how i can get the video src value? How to get video tag src using JavaScript?
var vids = document.getElementsByTagName('video')
// vids is an HTMLCollection
for( var i = 0; i < vids.length; i++ ){
console.log( vids.item(i).src )
}
So getElementsByTagName is a good start. But how to get the src property?
And how to manipulate it to keep the actual video path and just add sth to the end?
I have a site with multiple video elements. I must add #t=0.1 to src="" of each video.
<div itemprop="video" itemscope itemtype="http://schema/VideoObject" class="seovid">
<object>
<video width="640" controls controlsList="nodownload">
<source src="https://www.xzy/bla.mp4">
Dein Browser unterstützt keine HTML5 Videos oder Du nutzt eine veraltete Version.
</video>
</object>
<h3 itemprop="name“>bla</h3>
<p itemprop="description“>bla</p>
</div>
So I was looking around for hours now, finding things close to what I'm looking for but not working for me:
Jquery - how i can get the video src value? How to get video tag src using JavaScript?
var vids = document.getElementsByTagName('video')
// vids is an HTMLCollection
for( var i = 0; i < vids.length; i++ ){
console.log( vids.item(i).src )
}
So getElementsByTagName is a good start. But how to get the src property?
And how to manipulate it to keep the actual video path and just add sth to the end?
3 Answers
Reset to default 4So, you want to append the #t=0.1 to the source.
You can get the source tag elements by getElementsByTagName('source) and then get the src attribute.
Below is the code.
var vids = document.getElementsByTagName('video')
// vids is an HTMLCollection
for( var i = 0; i < vids.length; i++ ){
//#t=0.1
vids.item(i).getElementsByTagName('source')[i].src += "#t=0.1" ;
console.log( vids.item(i).getElementsByTagName('source')[i].src);
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<div itemprop="video" itemscope itemtype="http://schema/VideoObject" class="seovid">
<object>
<video width="640" controls controlsList="nodownload">
<source src="https://www.xzy/bla.mp4">
Dein Browser unterstützt keine HTML5 Videos oder Du nutzt eine veraltete Version.
</video>
</object>
<h3 itemprop="name“>bla</h3>
<p itemprop="description“>bla</p>
</div>
</body>
</html>
<div itemprop="video" itemscope itemtype="http://schema/VideoObject" class="seovid">
<object>
<video width="640" controls controlsList="nodownload">
<source src="https://www.xzy/bla.mp4">
Dein Browser unterstützt keine HTML5 Videos oder Du nutzt eine veraltete Version.
</video>
</object>
<h3 itemprop="name“>bla</h3>
<p itemprop="description“>bla</p>
</div>
var vids = document.getElementsByTagName('video')
// vids is an HTMLCollection
for( var i = 0; i < vids.length; i++ ){
vids[i].children[0].setAttribute('src', vids[i].children[0].src+'#0.1');
}
From the code that you provided, the src is not on the video tag.
It's an attribute of tag source.
You can get a value of an attribute in javascript by using getAttribute('NameOfTheAttribute').
Below is the correct js
var vids = document.getElementsByTagName('source')
// vids is an HTMLCollection
for( var i = 0; i < vids.length; i++ ){
console.log( vids.item(i).getAttribute('src') )
}fiddle: https://jsfiddle/xldlx/yw4fzmk1/3/