javascript - NextSibling 类不工作

Question

这是我的代码，它没有发出任何警报，也没有返回任何好的 :(第一部分工作正常但事后它没有:(我似乎无法弄清楚问题是什么..

   this.getNextItem = function(o) {
// given <li> playlist item, find next <li> and then <a>

  if (o.nextElementSibling) {
      o = o.nextElementSibling;
    } 
    else {

      o = o.nextSibling;

  }


    while (o && o.className !== 'playerr') {
       if (o.nextElementSibling) {
             o = o.nextElementSibling;

             } else {

                o = o.nextSibling;

             }

       }

   if(o){ if (o.className !== 'playerr') { //nodeName.toLowerCase()


          return null;
    } else {
         alert(o.className);
          alert(o.getElementsByTagName('a')[0]);
      return o.getElementsByTagName('a')[0];
    }}

  };

如果您想查看完整的上下文，请使用 http://beastdrops.com然后在 consol 中运行 page("content2") 以获取新的“播放器”将歌曲转发到结尾，然后当它要切换到下一首时，它不会... :( 这就是这个脚本必须做的

Answer 1

好的，根据您的意见，您似乎想做 nextByClass()所以这是一个版本:

function hasClass(elem, cls) {
    var str = " " + elem.className + " ";
    var testCls = " " + cls + " ";
    return(str.indexOf(testCls) != -1) ;
}

function nextByClass(node, cls) {
    while (node = node.nextSibling) {
        if (hasClass(node, cls)) {
            return node;
        }
    }
    return null;
}

工作演示:http://jsfiddle.net/jfriend00/3L9FL/

您可以使用它来查找具有所需类别的同一级别的下一个项目，如下所示:

// assumes you pass it the node for the starting <li>
// returns first link in next <li> with the desired classor null if none
this.getNextItem = function(node) {
    node = nextByClass(node, "playerr");
    if (node) {
        return node.getElementsByTagName('a')[0];
    }
    return null;
}

---

旧版本的答案被评论中的澄清所取代:

根据代码中的注释，给定的元素似乎是 <li>标签，你只想找到下一个<li>在同一水平上。如果是这样的话，这里有一个非常简单的函数，它可以找到同一个 tagName 的下一个兄弟:

// gets the next sibling with the same tagName as the starting point
// returns null if none found
function nextByTag(node) {
    var tag = node.tagName;
    while (node = node.nextSibling) {
        if (node.tagName === tag) {
            return node;
        }
    }
    return null;
}

---

您可以使用它来查找下一个 <li> 中的第一个后代链接像这样:

// assumes you pass it the node for the starting <li>
// returns first link in next <li> or null if none
this.getNextItem = function(node) {
    node = nextByTag(node);
    if (node) {
        return node.getElementsByTagName('a')[0];
    }
    return null;
}