js 简单实现 NodeIterator 接口

源代码

/**
 * @description 实现一个遍历 DOM iterator
 * @author day0 2021-6-17
 * @version 1.0.0
 * @param { object } root 被遍历的根节点
 * @param { function } filter 过滤器函数，返回 true 表示要查找此节点，返回 false 表示要过滤此节点
 * @returns { object } 返回遍历器对象，包含 nextNode 方法与 previewNode 方法
 */
function findTree(root, filter) {
  let childs = root.childNodes,
    len = root.childNodes.length,
    index = 0,
    needChilds = [];

  console.log(childs);

  if (typeof filter === "function") {
    while (index < len) {
      if (filter(childs[index])) {
        needChilds.push(childs[index]);
      }
      ++index;
    }
    index = 0;
    len = needChilds.length;
  } else {
    needChilds = childs;
  }

  return {
    nextNode() {
      return index < len
        ? { node: needChilds[index++], done: false }
        : { node: undefined, done: true };
    },
    previousNode() {
      return index > 0
        ? { node: needChilds[--index], done: false }
        : { node: undefined, done: true };
    },
  };
}

var filter = function (node) {
  return node.nodeName.toLowerCase() == "p" ? true : false;
};

var it = findTree(document.body, filter);
var current = it.nextNode();
while (!current.done) {
  console.log(current.node);
  current = it.nextNode();
}

南无阿弥陀佛