介绍
list.js 是一个小巧而强大的 JavaScript 库，用于快速和简单地搜索、排序和过滤 HTML 列表。它是基于原生 JavaScript 开发的，没有依赖项。通过使用该库，您可以轻松地将列表转换为具有搜索、排序和过滤功能的交互式组件。
安装
在使用 list.js 之前，您需要先安装它。您可以通过以下命令在命令行中安装 list.js：
npm install list.js --save
基本用法
下面是一个简单的示例，演示了如何使用 list.js 在 HTML 页面上创建一个可搜索、可排序、可过滤的列表。
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
-------------- ----------
----- ---------------- --------------------------------------------------------------
-------
------
------ -------------- -----------------
------- ------------ -------------------------------
------- ------------ ------------------------------
------- -------------- ---------------------------
------- ----------------------
------- ------------------------
------- --------------------------
---------
--- -------------
----
--- --------------------
-- ------------------
-- ---------------------
-----
----
--- --------------------
-- ------------------
-- ---------------------
-----
----
--- --------------------
-- ------------------
-- ---------------------
-----
-----
------- ---------------------------------------------------------------------
--------
--- ------- - -
----------- -------- ------ ---------
--
--- -------- - --- ------------ ---------
---------
-------
-------以上示例中，我们添加了一个可搜索、可排序、可过滤的列表。我们通过添加 class 属性来标识要搜索、排序或过滤的元素。然后，在 JavaScript 中创建了一个新的 List 实例，并将其连接到 HTML 页面上的列表。
高级用法
除了基本用法之外，list.js 还提供了许多高级功能，可以帮助您轻松地自定义和扩展您的列表。下面是一些示例：
搜索引擎
如果您想要更加强大和精确的搜索功能，list.js 提供了一个名为 fuzzySearch 的插件。通过使用该插件，您可以实现模糊搜索、大小写敏感搜索、全词匹配搜索等功能。
var options = {
valueNames: ['name', 'age', 'gender']
};
var userList = new List('body', options);
userList.fuzzySearch({searchClass: 'search-box'});分页
如果您的列表非常长，那么分页是必不可少的功能之一。list.js 提供了一个名为 paging 的插件，可以帮助您轻松地将列表分成多个页面，并提供导航栏和样式。
-- -------------------- ---- -------
--- ------- - -
----------- -------- ------ ----------
----- --
-------- -
------------------
-
--
--- -------- - --- ------------ ---------动态加载数据
如果您的列表数据是动态从服务器加载的，那么 list.js 提供了一个名为 add 的方法，可以帮助您轻松
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/32578
