概述
npm 是 Node.js 的包管理器,可以很方便地安装各种第三方模块,提高开发效率。doesangue 是一个针对前端开发的 npm 包,它提供了一些常用的 CSS 样式和 JavaScript 函数,可以让前端开发人员更快捷地开发 Web 应用程序。
安装
使用 npm 安装 doesangue 很简单,只需要在控制台中输入以下命令:
npm install doesangue
安装之后可以在项目中直接使用这个包,引入样式或者函数即可。
提供的样式
doesangue 提供了一些常用的 CSS 样式,这些样式可以帮助我们更快捷地开发 Web 页面。
文字样式
.text-center
:文字居中。.text-left
:文字左对齐。.text-right
:文字右对齐。.text-justify
:文字两端对齐。.text-uppercase
:将文字转换为大写。.text-lowercase
:将文字转换为小写。.text-capitalize
:将每个单词的第一个字母转换为大写。
边框样式
.border
:带有默认颜色的边框。.border-top
:带有默认颜色的上边框。.border-right
:带有默认颜色的右边框。.border-bottom
:带有默认颜色的下边框。.border-left
:带有默认颜色的左边框。.border-radius
:带有默认圆角的边框。
按钮样式
.btn-default
:带有默认样式的按钮。.btn-primary
:带有主要样式的按钮。.btn-success
:带有成功样式的按钮。.btn-info
:带有信息样式的按钮。.btn-warning
:带有警告样式的按钮。.btn-danger
:带有危险样式的按钮。
提供的函数
doesangue 也提供了一些常用的 JavaScript 函数,这些函数可以帮助我们更快捷地编写 JavaScript 代码。
循环函数
each(arr, callback)
:遍历数组或者对象。map(arr, callback)
:遍历数组或者对象,返回一个新的数组。filter(arr, callback)
:遍历数组或者对象,返回符合条件的元素组成的新数组。
格式化函数
formatNumber(num, [decimals])
:格式化数字,可以设置小数位数。
操作函数
hasClass(el, className)
:判断元素是否有某个样式。addClass(el, className)
:为元素添加样式。removeClass(el, className)
:为元素移除样式。toggleClass(el, className)
:为元素开关样式。
示例代码
-- -------------------- ---- ------- --------- ----- ------ ------ ------ ---------------- ----------------- ------------ ------ ---------------- --------------- ----------------------------------------------------- -------- ---------------------- ------------------------------------------------------------ ------- ------ ---- -------------------------- --------------- ----- --------------- ----------------------- ------- -------- -------------------------------- ----- ------------- ------------- ------------- ------ -------- ----------------------- ---- ---- ----- ------ - ------ ----- ------ ------------------------ -------- ------- ----- - -------------------- - -- - - ------ ----- ---- ----- ----- --- - ----------- ------------------------------------------- ----------------------------------------- ---- ---- ----------- ----- --- - ---------------------------------- ---- ------------------------ ---------- - --------------------------------- --- ---- ---------- ------------------------- -------------- ---------------------------- ---------- ---------- ------- -------
结束语
doesangue 的样式和函数不是很多,但是也足以满足日常开发的需求。不过,如果你需要更多的样式和函数,可以考虑其他更强大的前端框架,如 Bootstrap、Vue.js 等。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/60056ce781e8991b448e69c1