以下是一个示例代码,用于实现按钮需要2次点击才能交换div的效果:
HTML代码:
Div 1
Div 2
JavaScript代码:
// 获取div和按钮的元素
var div1 = document.getElementById("div1");
var div2 = document.getElementById("div2");
var swapBtn = document.getElementById("swapBtn");
// 设置点击计数器
var clickCount = 0;
// 绑定按钮的点击事件
swapBtn.addEventListener("click", function() {
// 增加点击计数器
clickCount++;
// 当点击计数器为奇数时,交换div的位置
if (clickCount % 2 === 1) {
// 创建一个临时div元素,用于交换div的位置
var tempDiv = document.createElement("div");
tempDiv.innerHTML = div1.innerHTML;
div1.innerHTML = div2.innerHTML;
div2.innerHTML = tempDiv.innerHTML;
}
});
这段代码使用了一个点击计数器来记录按钮点击的次数,当点击次数为奇数时,交换div的位置。点击计数器为偶数时,不执行交换操作。通过创建一个临时div元素来实现div的交换。