什么是 traversy？
traversy 是一个简单、轻量级的 DOM 操作库，它提供了方便的 API 来操作 DOM，使得开发者可以更轻松地操纵 HTML 元素。它的 API 设计简明清晰，易于上手。
如何安装 traversy？
你可以使用 npm 来安装 traversy：
npm install traversy
然后，你就可以在你的项目中使用 traversy 了。
traversy 的 API
traversy 的 API 相当简单易用，它提供了以下方法供开发者使用：
q(selector)：查询满足指定选择器的第一个元素。qa(selector)：查询满足指定选择器的所有元素。html(element, html)：设置指定元素的 HTML 内容。text(element, text)：设置指定元素的文本内容。attr(element, name, value)：设置指定元素的属性。removeAttr(element, name)：移除指定元素的属性。addClass(element, className)：给指定元素添加指定的 CSS 类名。removeClass(element, className)：从指定元素中移除指定的 CSS 类名。toggleClass(element, className)：切换指定元素的指定 CSS 类名，如果元素已经有该类名，则移除该类名；否则添加该类名。on(element, eventName, handler)：为指定元素添加事件监听器。off(element, eventName, handler)：从指定元素移除事件监听器。
traversy 的示例代码
以下是一个使用 traversy 实现事件代理的示例：
-- -------------------- ---- -------
--------- -----
----- ----------
------
----- --------------- --
--------------- ------------
-------
---- -
------ ----
-
----- -
------ -----
-
--------
-------
------
----
------ -------- ------------------------
------ -------- --------------------------
-----
------- --------------------------------------------------------
--------
----------------------------------------- -------- -------- ------- -
--- ------ - -------------
-- --------------- --- ---- -
-----------------------
---------------------------- -------
---------------------------- --------
-
---
---------
-------
-------在上面的示例中，我们先在 head 元素中定义了两个 CSS 类名 red 和 blue，然后在 body 元素中定义了一个 ul 元素和两个 li 元素，每个 li 元素中都有一个带有不同 CSS 类名的 a 元素。
在 script 元素中，我们首先使用 querySelector 方法获取了 ul 元素的引用，然后使用 traversy.on 方法为 ul 元素添加了一个点击事件的监听器。当用户点击 ul 中的任意一个 a 元素时，我们会通过 event.target 获取到当前被点击的元素，然后使用 traversy.toggleClass 方法来更改该元素的 CSS 类名，从而实现红蓝色的切换。
traversy 的指导意义
使用 traversy 可以使得前端开发更加方便快捷，它几乎可以替代 jQuery，同时它的文档很详细，学习起来也非常容易。如果你正在学习前端开发或者想要提高自己的前端技能，那么 traversy 绝对是一个值得学习和使用的库！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/78052