dom-iterator中文文档|dom-iterator js中文教程|解析

npm npmdoc 2年前 (2022-01-01) 545次浏览

dom-iterator中文文档|dom-iterator js中文教程|解析

安装命令:npm i dom-iterator

dom-iterator

功能丰富、经过良好测试的迭代器,用于遍历 DOM 节点。一个更好的NodeIterator版本双向旅行。

可以在 node.js 中使用mini-html-parser

安装

使用组件(1)安装

$ component install matthewmueller/dom-iterator

使用 node.js:

$ npm install dom-iterator

例子

var it = iterator(node);
var next;
 
while (next = it.next(Node.TEXT_NODE)) {
  console.log(next.nodeValue) // next textnodes after node
}

应用程序接口

iterator(node, root)

初始化一个从 开始的迭代器node您可以选择指定 aroot来限制对特定子树的遍历。
root必须是 的父代或祖先node

var it = iterator(el.firstChild, el)

iterator#next([expr], [n])

获取下一个 DOM node如果不node存在,则返回null您可以传递一个表达式expr,以获取匹配的第一个节点expr

此外,您可以传递一个数字来选择nth节点。默认为11st节点。

var node = it.next()
// select the 2nd element node we come across
var next = it.next(Node.ELEMENT_NODE, 2)

下面来看看DOM是如何遍历的:

下一个

iterator#prev(), iterator#previous()

获取之前的 DOM node如果不node存在,则返回null您可以传递一个表达式expr,以获取匹配的第一个节点expr

此外,您可以传递一个数字来选择nth节点。默认为11st节点。

var node = it.prev()
// select the 2nd element node we come across
var prev = it.prev(Node.ELEMENT_NODE, 2)

下面来看看DOM是如何遍历的:

上一页

iterator.select(expr)

遍历传递表达式的节点exprexpr可以是一个枚举,数字,字符串或功能。如果是数字,nodeType则进行比较。

此函数可以链接,其中所有表达式都进行 OR 运算。

it.select(Node.ELEMENT_NODE)
  .select(8)
  .select('nodeValue == "sloth"')
  .select(fn)

这是在说:

选择所有元素节点或注释节点或节点值为“sloth”的节点或通过函数的节点fn

iterator.reject(expr)

迭代不通过表达式的节点exprexpr可以是一个枚举,数字,字符串或功能。如果是数字,nodeType则进行比较。

此函数可以链接到所有表达式都为 AND 的地方。

it.reject(Node.ELEMENT_NODE)
  .reject(8)
  .reject('nodeValue == "sloth"')
  .reject(fn)

这是在说:

拒绝所有元素节点和注释节点以及具有 nodeValue 树懒的节点和通过函数fn“.

iterator.revisit(revisit)

您还可以通过设置revisit为 false 来跳过已经访问过的元素默认情况下,revisit设置为true

it.revisit(false);

这是改变迭代器的方式:

it.next():

下一个

它.prev()

上一页

iterator.opening()

跳转到元素的开始标记。这是默认设置。

var dom = domify('<em>hi</em>');
var it = it(dom).opening()
it.next() // 'hi'

iterator.closing()

跳转到元素的结束标记

var dom = domify('<em>hi</em>');
var it = it(dom).closing()
it.prev() // 'hi'

iterator.peek([expr], [n])

有时您想在不实际访问的情况下查看下一个或上一个节点。有了peek你可以窥视前进或后退n的步骤。如果没有n给出,则向前看 1 步。

顶峰前进:

it.peek(); // peek forward 1
it.peek(3); // peek forward 3 steps

向后峰值:

it.peek(Node.ELEMENT_NODE, -3) // peek backwards 3 steps, only selecting element nodes

iterator.reset([newNode])

将迭代器重置为原始node. 可选地传递 anewNode开始。

it.reset();

iterator.use(fn)

向迭代器添加插件。

运行测试

在服务器上:

npm install
make test

或者在浏览器中:

npm install
make test-browser

执照

麻省理工学院

项目贡献人员列表:


极客公园 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:dom-iterator中文文档|dom-iterator js中文教程|解析
喜欢 (0)
.excerpt .focus {display:none}