javascript - 使用纯 JavaScript 在元素之间移动类，而不使用 jQuery

Question

你能帮我用这个普通的js代码吗，因为我想将className“active”从一个项目移动到另一个项目，包括删除所有元素类并将其与this.item一起保留

function moveClass(){

  var item = document.getElementsByClassName('item');

  for(var i = 0 ; i < item.length ; i++){

    var items = item[i];

    items.onclick=function(){

    items.classList.remove('active');
    this.classList.add('active');

    }
  }

}

window.addEventListener('load',moveClass)

Answer 1

您可以使用 document.querySelector('.item.active') 查找当前事件项目，并从中删除 .active。然后，只需将事件分配给单击的项目( fiddle ):

function moveClass() {

    var items = document.getElementsByClassName('item');

    for (var i = 0; i < items.length; i++) {

        items[i].onclick = function () {
            var prevActive = document.querySelector('.item.active');

            prevActive !== null && prevActive.classList.remove('active');

            this.classList.add('active');
        }
    }

}

document.addEventListener('DOMContentLoaded', moveClass);