获取 HTML <source> 的 ID答案

【问题标题】：getting ID of HTML <source>获取 HTML <source> 的 ID
【发布时间】：2016-05-05 23:52:37
【问题描述】：

我正在尝试从 JSON 文件加载我网站上的视频和声音文件源。我使用以下方法对页面上的其他元素执行此操作：

`$('#cimg').attr('src', jsonObj.cloud[0].refimage)`

这似乎适用于图像之类的东西，但不适用于具有如下源标签的 HTML 5 视频和声音文件：

<source id="cvid" src="" type="video/mp4">

我认为你不能在源标签中创建 ID，因为同样的方法适用于 img 标签。

有谁知道我如何从源标签中提供或访问 id？

【问题讨论】：

标签： javascript jquery html css json

【解决方案1】：

你可以抓住标签：

console.log($('source').attr('id'))

JSFiddle with your code

【讨论】：

我不确定你的意思。我需要在 `$('#cimg').attr 部分中获取它
我也有不止一个源标签，所以这种方式行不通

【解决方案2】：

您可以像访问任何其他元素一样访问<source> 元素，无论是id。

然而你忘记的是，当你修改它的src 属性时，你必须调用它的容器<video> 元素的.load() 方法。

var vid = document.getElementById('vid');
var source = document.getElementById('cvid');
var src = ['http://www.sample-videos.com/video/mp4/240/big_buck_bunny_240p_50mb.mp4', 'http://vjs.zencdn.net/v/oceans.mp4'];
var s = 0;

document.getElementById('btn').onclick = function(){
  
  // change the <source> 's src
  cvid.src = src[++s%src.length];
  // ask the <video> to load this new source
  vid.load();

  // could also be 
  // cvid.parentNode.load();
  
  }

<button id="btn">switch video source</button><br>
<video controls muted autoplay id="vid">
<source id="cvid" src="http://www.sample-videos.com/video/mp4/240/big_buck_bunny_240p_50mb.mp4" type="video/mp4">
</video>

【讨论】：