点击按钮modal-body里面的内容动态切换

要实现点击按钮切换modal-body里面的内容，可以使用JavaScript来实现。以下是一个简单的例子：

HTML部分：

<button onclick="changeContent(1)">内容1</button>
<button onclick="changeContent(2)">内容2</button>
<button onclick="changeContent(3)">内容3</button>

<div id="modal-body">
  <div id="content1" class="content">这是内容1</div>
  <div id="content2" class="content">这是内容2</div>
  <div id="content3" class="content">这是内容3</div>
</div>

CSS部分：

.content {
  display: none;
}

JavaScript部分：

function changeContent(contentIndex) {
  // 隐藏所有内容
  var contents = document.getElementsByClassName("content");
  for (var i = 0; i < contents.length; i++) {
    contents[i].style.display = "none";
  }
  
  // 显示指定的内容
  var targetContent = document.getElementById("content" + contentIndex);
  if (targetContent) {
    targetContent.style.display = "block";
  }
}

这个例子中，我们首先在HTML中给按钮绑定了一个点击事件，点击按钮会调用changeContent函数并传入相应的索引值。changeContent函数会根据传入的索引值来切换内容的显示。

其中，我们使用CSS将所有内容的display属性设置为none，即隐藏所有内容。然后在changeContent函数中，我们首先隐藏所有内容，然后根据传入的索引值找到对应的内容元素，并将其display属性设置为block，即显示该内容。

这样，当点击按钮时，对应的内容就会在modal-body中动态切换显示