简介
tinysort 是一个快速轻量级的 JavaScript 排序库，它可以用于对 HTML 元素进行排序。使用 tinysort 可以让开发者快速实现各种排序需求，同时也能提高页面响应速度。
安装
在使用 tinysort 之前，需要先将其安装到项目中。可以通过 npm 安装：
--- ------- --------
或者通过 CDN 引入：
------- -----------------------------------------------------
使用方法
基本用法
假设有如下 HTML 结构：
--- ---------- ------------ ------------ ------------ -----
我们想要按字母顺序对这些 li 元素进行排序，可以使用 tinysort：
----- ---- - -------------------------------- ------------------------------------------
此时，li 元素就会按照字母顺序依次排列。
高级用法
除了基本用法外，tinysort 还提供了一些高级用法，例如自定义排序规则、多重排序等。下面是一些示例代码：
自定义排序规则
假如有如下 HTML 结构：
--- ---------- -------------- --------------- ------------ -----
如果直接使用 tinysort 进行排序，会得到错误的结果。因为默认情况下，tinysort 将字符串转换为数字后进行比较，而这些字符串中有逗号，无法直接转换为数字。
为了解决这个问题，我们可以自定义排序规则：
----- ---- - --------------------------------
---------
--------------------------------
-
----- ------------- -- -------
------------- ----------- -- -
----- ------ - ------------------------------------- ----- -- ---------
----- ------ - ------------------------------------- -----
------ ------ - -------
-
-
--在这个示例中，每个 li 元素都添加了一个 sort-value 属性，用于存储排序数据。当执行 tinysort 时，通过设置 data 参数指定使用该属性进行排序，同时通过设置 sortFunction 参数来自定义排序规则。在 sortFunction 中，将 sort-value 属性中的字符串转换为数字后进行比较，即可得到正确的排序结果。
多重排序
假如有如下 HTML 结构：
------ -----------
-------
----
-----------
-----------
-----------
-----
--------
-------
----
-----------
-----------
----------
-----
----
-----------
-----------
----------
-----
----
-----------
-----------
----------
-----
--------
--------我们想要先按照性别进行排序，再按照年龄进行排序，最后按照姓名进行排序。可以使用 tinysort：
----- ----- - ---------------------------------
---------
------------------------------------------------------------------
-
--------- ----------------- ---------------- ---------------- -- --------
-
--在这个示例中，通过设置 selector 参数指定多重排序规则。selector 中的每一项都是一个 CSS 选择器，用于指定排序时参考的
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/36995