,可以通过以下步骤实现:
以下是一个示例代码:
<!DOCTYPE html>
<html>
<head>
<style>
.navbar {
background-color: #ccc;
padding: 10px;
}
.content {
background-color: #fff;
padding: 20px;
}
</style>
</head>
<body>
<div class="navbar">
<button id="toggleBtn">切换导航栏</button>
</div>
<div class="content" id="element1">
这是元素1
</div>
<div class="content" id="element2">
这是元素2
</div>
<script>
var toggleBtn = document.getElementById('toggleBtn');
var element1 = document.getElementById('element1');
var element2 = document.getElementById('element2');
toggleBtn.addEventListener('click', function() {
var currentBg = element1.style.backgroundColor;
element1.style.backgroundColor = element2.style.backgroundColor;
element2.style.backgroundColor = currentBg;
});
</script>
</body>
</html>
在上述示例中,点击"切换导航栏"按钮时,会交换元素1和元素2的背景颜色。你可以根据实际需求修改代码中的样式和元素选择器。
领取专属 10元无门槛券
手把手带您无忧上云