javascript - 获取非同级类的下一个元素

Question

我想遍历 page 并通过它们切换 active 类。我应该如何在不使用set类的情况下执行此操作？

HTML

<div class="page active"></div>
<div class="set">
    <div class="page"></div>
    <div class="page"></div>
</div>
<div class="page"></div>

jQuery

$('.active').toggleClass('active').toggle().nextAll('.page').toggleClass('active');

Answer 1

我假设“遍历”意味着您想要以某种顺序逐个切换 .page div。如果是这种情况，请编写一个遍历树的算法:给定一个根，如果它是 .page 则切换，并递归地处理它的每个子节点

function traverse(root){
  if(!root) return;
  if(root.hasClass('page')) root.toggle('active');
  root.children().forEach(function(child){
    traverse(child);
  });

  //lets say you want to bind to click event on every div
  $('div').click(function(){
    traverse($(this));
  });
}