介绍
cup.min.js 是一款前端使用的库，它提供了类似于 jQuery 的 DOM 操作的功能，同时也支持一些常见的工具函数。但与 jQuery 不同的是，cup.min.js 的体积更小，且不依赖于其他库。
安装
在使用 cup.min.js 之前，要先安装它。可以使用 npm 或者 CDN 进行安装。
npm 安装方法
打开终端，进入你的项目文件夹，执行以下命令：
npm install cup.min.js
CDN 安装方法
在 HTML 文件中引用以下代码：
<script src="https://cdn.jsdelivr.net/npm/cup.min.js"></script>
使用
选择元素
在 cup.min.js 中，使用 $ 函数选择元素，其用法与 jQuery 相同。
let el = $('#my-element');操作元素
cup.min.js 也提供了许多操作元素的方法。
获取和设置元素属性
el.attr('name', 'new-name');
let name = el.attr('name');获取和设置元素内容
el.html('<div>new html</div>');
let html = el.html();绑定事件
el.on('click', function() {
console.log('clicked!');
});显示和隐藏元素
el.show(); el.hide();
工具函数
cup.min.js 还提供了许多实用的工具函数。
$ajax
该函数封装了原生的 XMLHttpRequest 对象，可以发送 AJAX 请求。
$ajax({
url: '/api/data',
type: 'POST',
data: { someData: 'data' },
success: function(response) {
console.log(response);
}
});debounce 和 throttle
这两个函数可以控制函数的调用频率。
let someFunction = function() {
console.log('called!');
};
let debouncedFunction = debounce(someFunction, 500);
let throttledFunction = throttle(someFunction, 500);
window.addEventListener('scroll', debouncedFunction);
window.addEventListener('scroll', throttledFunction);示例代码
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
----------------- ----------
------- -------------------------------------------------------
-------
------
------- -------------------- ------------
---- ------------------------
--------
--- ------ - ----------------
--- --------- - -------------------
------------------ ---------- -
-------
---- ------------
----- -------
----- - --------- ------ --
-------- ------------------ -
-------------------------
-
---
---
---------
-------
-------结论
cup.min.js 是一款轻量级的前端库，与其他大型库相比，它更简单，却能提供很多实用的功能。如果你希望在项目中使用一些简单的 DOM 操作和工具函数，那么 cup.min.js 就是一个很好的选择。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066bc2967216659e244234