简介
fundament-npm 是一个简单易用的npm包，主要是为Jquery或Zepto设计的UI框架，它提供了常用UI元素、表单验证和一些工具函数等。这个包被广泛运用在Web前端开发中，它在开发中提供了很大的便利性，让我们对于前端开发有了更深入的理解和应用。
安装和引入
安装和引入非常简单，只需要在项目的根目录输入以下命令即可完成安装：
--- ------- ------------- ------
安装后，可以在项目中通过以下方式引入：
--- - - ------------------ --- --------- - -----------------------------------
使用
常用UI元素
fundament-npm 提供了许多常用UI元素，如 buttons, forms, cards, modal and tooltips 等等。这里将展示如何使用其中的一些元素。
Buttons
button元素是Web前端开发中经常会用的元素，使用fundament-npm 中的button元素十分方便。使用时，只需要在HTML中添加以下标签：
------- ----------------- ---------------
注意：在使用前，需要确认样式表已经引入到了HTML页面中。
Forms
form元素也是Web前端开发中十分重要的元素。使用fundament-npm 中的form元素非常方便。使用时，只需要在HTML中添加以下标签：
------
---- ------------------
------ ----------- ------------------ ------
------
---- ------------------
------ ----------- ----------------- ------
------
---- ------------------
------ ----------- --------------------
------
---- ---------
------- ------------- -------------------------------
------
-------Cards
card元素是一个包含文本块和图片等的盒子，与其他元素相比具有更好的视觉效果。使用fundament-npm 中的card元素非常方便。使用时，只需要在HTML中添加以下标签：
---- -------------
---- ---------
---- ------------------------------------------------------------------------------ ------------- -------
------
---- ---------
--- -------------------- ---- -------------
-- ---------------------- ------- --- ---- -- --- -------- -- ----- ---- ---- ------- -------- -- ----- ------ -- --- ---- -- --- ----------
------
------表单验证
表单验证是Web前端开发中一个重要的环节。fundament-npm 中也提供了一些表单验证相关的功能。下面将介绍如何使用其中的一些功能。
Email验证
使用Email验证时，只需要在HTML中添加以下标签：
---- ------------------
------ ------------ ------------------- ------------------------
------Required验证
使用Required验证时，只需要在HTML中添加以下标签：
---- ------------------ ------ ----------- ------------------ --------------------------- ------
MinMax验证
使用MinMax验证时，只需要在HTML中添加以下标签：
---- ------------------ ------ ------------- ----------------- ---------------------- ------ -------- ------
工具函数
fundament-npm 中还提供了一些工具函数，下面将介绍其中的一些函数。
格式化日期
--- ---- - ------------------------------------------ --------------------- ----------- ------------------
输出结果为：
----------- ---------
取得URL参数
--- ------ - ----------------------------------- --------------------
输出结果为：
- --- ----- ----- ------- -
总结
在本文中，我们对fundament-npm进行了详细的介绍和使用教程。它为Web前端开发带来了很大的便利性，让我们在开发中体验到了更好的效果。虽然我们只是介绍了其中的一些元素和功能，但日后的学习中，将有更多的元素和功能的使用。希望本文对于前端开发人员有所帮助，谢谢。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600562f681e8991b448e0c0c