查找所有视频元素并处理源src

时间:2018-10-26 08:36:10

标签: javascript html video src

我有一个包含多个视频元素的网站。我必须在每个视频的#t=0.1中添加src=""

<div itemprop="video" itemscope itemtype="http://schema.org/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>

所以我现在已经逛了好几个小时,发现的东西接近我要找的东西,但对我却没有用:

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 )
}

因此getElementsByTagName是一个好的开始。但是,如何获取src属性? 以及如何操纵它以保留实际的视频路径并仅在末尾添加sth

3 个答案:

答案 0 :(得分:1)

因此,您想将#t=0.1附加到源中。 您可以通过getElementsByTagName('source)获取源标签元素,然后获取src属性。

下面是代码。

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.org/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>

答案 1 :(得分:0)

根据您提供的代码,src不在视频标签上。
这是标签源的属性。
您可以使用 getAttribute('NameOfTheAttribute')在javascript中获取属性值。
下面是正确的js

StandardError

小提琴: https://jsfiddle.net/xldlx/yw4fzmk1/3/

答案 2 :(得分:0)

    <div itemprop="video" itemscope itemtype="http://schema.org/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');
}