javascript - 直接单击时替换 <div>

标签 javascript html swap

我正在寻找一些 JS 代码,当单击时,它将用另一个 div 替换。没有外部链接或按钮,只需在单击原始 div 内的任意位置时将 div 交换到新的 div 即可。我还想做到一旦单击并交换,第二次单击就不会再将其交换回来。

示例:我有一个用于直播的盒子 div,其中包含内容(日程信息等),单击该 div 上的任意位置会将其替换为实际的直播嵌入。

这可能吗?

最佳答案

不明白为什么每个人都给出 jQuery 解决方案。这是一个纯 JavaScript 的:

var livestream = document.getElementByID('livestream');

document.getElementById('schedule').onclick = function() {
    this.parentNode.replaceChild(livestream, this);
};

这里我假设替换是 DOM 的一部分。当然你也可以用 document.createElement [MDN] 动态生成.

我不知道你想对替换的元素做什么。它由 replaceChild 方法返回,因此您可以将其插入到任何您想要的位置。

引用:.replaceChild() [MDN]

关于javascript - 直接单击时替换 <div>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7217784/

相关文章:

javascript - 将输入长度限制为最多 10 个字符

javascript - < 标签有什么用?

php - 无法在我的 php session 中显示数据

c++ - swap 和 substr 函数的奇怪结果

c++ - 如何使用 C++ 引用交换两个 C 风格的字符串?

javascript - 如何从本地文件夹中获取图像以显示在 div 元素 html 上?

javascript - 如何使淡入/淡出只发生一次

html - 如何模糊背景图像 - css?

当顺序更改时,Python swap 会导致意外结果

javascript - Eclipse 插件开发 - JavaDoc,如 JavaScript 的悬停提示 (Eclipse JSDT)