jquery自定义组件开发

Posted 2021-02-11 awatangjay

jquery的组件已经有很多，但是有可能找不到符合我们需求的组件，所以我们可以动手自己封装一个jquery组件。

第一步要知道封装jquery组件的基本语法

(function ($) {
    $.fn.ziDinYiZuJian = function () {
        //ziDinYiZuJian 组件 要实现的功能代码
    }
})(jQuery)

第二步调用自定义的组件

　　调用组件必须要引入在组件中用到的js包，然后调用

<div id="dom"></div>
$(‘#dom‘).ziDinYiZuJian();

注意有可能会报错：$(...).ziDinYiZuJian is not a function. 

原因可能是 引入必要的js包的顺序有问题，如果是在子页面调用组件 如果母版页引入了相同js包可能会因为重复引用js包报错，所以最好把母版页的js包 都在页面一开始全引入

 

在封装自定义jquery组件的时候需要注意的细节问题：

1、组件的数据源只需要是具有某个特征的数据集就可以了

2、组件自己根据传入的控制参数相应的格式化数据

3、暴露出的事件所需要的参数一般是 对象+触发事件的对象

4、组件要尽量封装成可重用的组件

5、组件写好之后要整理一个组件使用文档（包括：需要传入的参数说明、暴露出来的事件、使用事例等等）