Bootstrap中的data-toggle,data-target

`data-toggle` 和 `data-target` 是Bootstrap中的两个HTML属性，用于定义一个触发器和一个目标元素。

`data-toggle` 属性指定了触发器的类型，可以是 `modal`、`dropdown`、`tab` 等。它告诉Bootstrap该元素是用来触发一个特定的功能。

`data-target` 属性指定了目标元素的选择器或ID。当触发器被触发时，Bootstrap会根据 `data-target` 属性查找目标元素，然后对其进行相应的操作，比如展示一个模态框。

举个例子，如果你想在一个按钮上添加模态框功能，你可以这样写：

<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">
  打开模态框
</button>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title" id="myModalLabel">模态框标题</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        模态框内容
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary">保存</button>
      </div>
    </div>
  </div>
</div>

这个例子中，`data-toggle="modal"` 和 `data-target="#myModal"` 指定了该按钮是一个触发模态框的按钮，并且对应的目标元素是 ID 为 `myModal` 的 `div` 元素。当按钮被点击时，Bootstrap会自动展示这个模态框。