如何实现按不同按钮显示不同的div

可以使用JavaScript来实现按不同按钮显示不同的div。具体步骤如下：

1. 在HTML中创建多个按钮和对应的div元素，给每个按钮和div元素设置一个唯一的ID。

2. 在JavaScript中获取所有的按钮和div元素，并给每个按钮添加一个点击事件监听器。

3. 在点击事件监听器中，获取当前点击的按钮的ID，然后根据按钮的ID来显示对应的div元素，同时隐藏其他的div元素。

以下是示例代码：

HTML代码：

<button id="btn1">按钮1</button>
<button id="btn2">按钮2</button>
<button id="btn3">按钮3</button>

<div id="div1" style="display:none;">内容1</div>
<div id="div2" style="display:none;">内容2</div>
<div id="div3" style="display:none;">内容3</div>

JavaScript代码：

// 获取所有的按钮和div元素
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
var btn3 = document.getElementById("btn3");
var div1 = document.getElementById("div1");
var div2 = document.getElementById("div2");
var div3 = document.getElementById("div3");

// 给每个按钮添加点击事件监听器
btn1.addEventListener("click", function() {
  // 显示div1，同时隐藏其他的div元素
  div1.style.display = "block";
  div2.style.display = "none";
  div3.style.display = "none";
});

btn2.addEventListener("click", function() {
  // 显示div2，同时隐藏其他的div元素
  div1.style.display = "none";
  div2.style.display = "block";
  div3.style.display = "none";
});

btn3.addEventListener("click", function() {
  // 显示div3，同时隐藏其他的div元素
  div1.style.display = "none";
  div2.style.display = "none";
  div3.style.display = "block";
});
``