Question

我有一份任意深刻的表格清单：

<ul>
 <li></li>
 <li>
  <ul>
   <li></li>
  </ul>
 </li>
</ul>

我正在尝试构建一个返回jQuery选择器的函数“nextElement”。

第一次调用该函数时，它返回列表中的第一个li。第二次调用它时，它返回页面中的下一个li。等等。

我希望这个功能不要关注兄弟姐妹，父母，孩子等。我所关心的是每次调用它时，源中的下一个li都会被选中。

关于如何接近这个的任何建议？

由于

Answer 1

no-jQuery解决方案..

function getIterator(){
    var nodes = document.getElementByTagName("li");
    var index = 0;
    return {
        next: function(){
            return nodes[index++];
        },
        hasNext: function(){
            return index < nodes.lenght - 1;
        }
    };
}

然后使用

var iterator = getIterator();
while (iterator.hasNext()){
    var node = iterator.next();
    console.log(node.innerHTML);
    // if you want to just wrap the node in $(node)....
}

或效率更高

var iterator = getIterator(), node;
while ((node = iterator.next())){
    console.log(node.innerHTML);
    // if you want to just wrap the node in $(node)....
}

Answer 2

可能最好将nextElement的概念修改为更像这样：

(function($) {
    var index = -1;
    jQuery.fn.nextElement = function() {
        index = (index + 1) % this.length;
        return this.eq(index);
    }
})(jQuery);

你可以像这样使用它：

$("li").nextElement(); // returns first li
$("li").nextElement(); // returns second li

等...

使用jQuery在页面源中选择下一个元素

2 个答案: