如何使用JavaScript为div元素添加active类？

HTML结构 #

<div class="form-wrap">
  <a href="" class="login-link">登录</a>
  <a href="" class="register-link">注册</a>
</div>

JavaScript实现 #

let wrapper = document.querySelector(".form-wrap");
let loginLink = document.querySelector(".login-link");
let registerLink = document.querySelector(".register-link");

registerLink.addEventListener("click", () => {
  wrapper.classList.add("active");
});

loginLink.addEventListener("click", () => {
  wrapper.classList.remove("active");
});

功能说明 #

• 两个锚点标签嵌套在form-wrap类的div内部
• 点击「注册」按钮时，该div会新增active类，类名变为form-wrap active
• 点击「登录」按钮时，div的active类会被移除，恢复原类名form-wrap

内容的提问来源于stack exchange，提问作者userS