如何在点击时更改div的内容？

Question

我有4个div：

• 媒体占位符
• 带图像的滑块
• 视频
• 3d嵌入式模型（基本上是iframe）

和3个文字链接：

• 图像
• 视频
• 3d

目标是根据所点击的链接，使用相对媒体div更改占位符div的内容。

＆＃34;解决方案＆＃34;我现在拥有的是加载所有位置：绝对位于同一位置，并根据点击的链接 - 将所讨论的div的不透明度更改为1，将div的其余部分更改为0。

显然，这种＆＃34;解决方案＆＃34;因为所有媒体同时被加载所以效果不好......所以我希望有更好的方法来做到这一点。 非常感谢。

Answer 1

有几种方法可以做到这一点，一种简单的方法是跟踪点击事件 您的链接并替换占位符Div中的内容，

 $( "#link1" ).click(function() {
  $("#placeHolder").html("link 1 content");
});

看看我做的这个例子：

https://codepen.io/anon/pen/XajOdg

Answer 2

如果你想通过点击任何元素（其他div）来改变div元素的文本，你可以这样做..

$("#other_div").click(function() {
 $(#div_content_to_be_changed).text("what ever you want");
});