单击链接时使用Javascript更改HTML？

假设我有一个名为“videoplayer”的DIV，在这个DIV中有一个图像

当点击链接时，有没有一种简单的方法来更改这个DIV中的HTML代码

例如，这是当前DIV：

    <div class = "big_player" id="player1">
             <img src="whatever.jpg">
    </div>

单击链接时，我希望HTML更改为：

    <div class = "big_player" id="player1">
             <script>
                playVideo(file, stream, key);
             </script>
    </div>

播放视频（文件、流、密钥）；

我有多个缩略图/链接（总共12个），包含所有不同的“文件、流、键”变量。请查看参考

---

实现这一点最简单、最简单的方法是什么？

是的，非常简单

var div = document.getElementById("player1");
div.onmousedown = function() {
    div.innerHTML = "stuff!"
};

---

JSFiddle：（单击test）

您可以创建如下函数：

function changeDiv(divID) {
    var div_to_change = document.getElementById(divID);
    div_to_change.innerHTML = 'whatever you want here';
}

打电话给

<a onClick="changeDiv('player1')" href="#">Click to change div</a>

---

我相信您希望在单击时运行脚本：

$('#player1').click(function(){playVideo(file, stream, key);});

这对其中一个（player1）是有效的，其余的你都需要这样做。请注意，您还必须定义函数参数（例如文件、流、键）或从div属性获取它们。 如果它们是动态的，请使用而不是

单击

但是，如果您确实想更改div的内容（无论出于何种原因），以下代码将放在click函数中：

var html_code = "<script>playVideo(file, stream, key);</script>";
$('#player1').html(html_code);

var html_code=“播放视频（文件、流、键）；”；
$（'#player1'）.html（html#u代码）；

编辑

在访问您的站点之后，我注意到您没有单击大div来更改其内容，而是单击其他div。在这种情况下，正确的选择器是
#miniplayer1
，
#miniplayer2
，等等。这样原始代码就变成
$（'#miniplayer1'）。单击（函数（）{playVideo（文件、流、键）；}）
使用jQuery可以轻松完成，但文件、流、密钥从何而来？欢迎使用；读这本书。当您现有的问题没有获得足够的流量时，正确的解决方案是将其编辑为更好的问题。简单地重复同样的问题是不可接受的。