ajax里拼接的div标签下的a标签添加点击事件选中和取消选中 写一个代码实例

可以按照以下步骤编写代码：

1. 给每个 a 标签添加一个 class 名称，以便在后续操作中方便定位它们。
2. 在点击事件中，获取当前点击的 a 标签的 class 名称，如果该标签已经被选中，则移除选中状态；否则添加选中状态。

以下是示例代码：

HTML 代码：

<div id="container">
  <div>
    <a href="#" class="option">选项1</a>
    <a href="#" class="option">选项2</a>
    <a href="#" class="option">选项3</a>
  </div>
</div>

JavaScript 代码：

// 获取所有的 a 标签
var options = document.querySelectorAll(".option");

// 遍历每个 a 标签，并为其添加点击事件
for (var i = 0; i < options.length; i++) {
  options[i].addEventListener("click", function(event) {
    // 阻止默认行为，避免页面跳转
    event.preventDefault();

    // 判断当前标签是否已经被选中
    if (this.classList.contains("selected")) {
      // 如果已经选中，则移除选中状态
      this.classList.remove("selected");
    } else {
      // 如果未选中，则添加选中状态
      this.classList.add("selected");
    }
  });
}

CSS 代码：

/* 选中状态下的样式 */
.selected {
  background-color: #f00;
  color: #fff;
}