js改变embed标签src值的方法

本文旨在分享如何使用JavaScript改变embed标签的src值，实现在网页上动态播放视频的功能。对于需要使用JavaScript操作元素属性的朋友们，这是一个非常有实用价值的技巧。

在日常工作中，我们可能会遇到这样的需求：一堆视频链接，点击相应的链接，需要在本页打开并播放对应的视频。初次尝试直接更改embed标签的src值似乎无法达到预期效果。我们也曾尝试清空embed标签的内容并重新写入，但依然无法成功。

经过多次尝试，我们发现一种有效的方法：先将embed标签隐藏（通过设置display为none），然后清空其内容，再写入新的src值。这样，我们就可以成功地在网页上播放点击链接所对应的视频了。

以下是实现这一功能的JavaScript代码示例：

```javascript

var tabv = document.getElementById("f_tabv"); // 获取元素

var tabva = tabv.getElementsByTagName("a"); // 获取元素中的链接

var tabcv = document.getElementById("f_tab_cv"); // 获取用于显示视频的容器元素

// 初始化，显示一个默认的嵌入视频

tabcvnerHTML = '';

// 为每个链接添加点击事件

for (var i = 0; i < tabva.length; i++) {

tabva[i].onclick = function() {

// 获取点击的链接的href值

var href1 = this.getAttribute("href");

// 构建新的嵌入视频的HTML字符串

var href2 = '';

// 隐藏原有的嵌入视频并清空内容

tabcv.getElementsByTagName("embed")[0].style.display = "none";

tabcvnerHTML = "";

// 显示新的嵌入视频

tabcvnerHTML = href2;

// 清除所有链接的类名，仅保留被点击链接的类名

for (i = 0; i < tabva.length; i++) {

tabva[i].className = "";

}

this.className = "act";

// 阻止链接的默认行为（即在新窗口打开链接）

return false;

}

}

```

希望本文所述能对大家的JavaScript编程有所启发和帮助。通过掌握JavaScript操作元素属性的技巧，我们可以实现更多有趣和实用的功能，为网页开发带来更多的可能性。