标题:手把手教你开发Jquery插件(一)
只看楼主
wangnannan
Rank: 18Rank: 18Rank: 18Rank: 18Rank: 18
等 级:贵宾
威 望:87
帖 子:2545
专家分:9359
注 册:2007-11-3
结帖率:80.91%
 问题点数:0 回复次数:4 
手把手教你开发Jquery插件(一)
早就想开这一帖子了 准备了好久 有些内容转载了网上现成的 因为我不是专业做前端的 有些吧可能说不太好 或者理解不够 所以请一定要给我指出来 大家共同进步
1 为什么不说原生JS插件?
本人水平问题 另外一方面现在的开发很少用JS开发原生JS插件 因为太过麻烦 我只说常用的 经常用的 以后新人工作后会砸到自己头上的


学会使用jQuery并不难 因为它简单易学 有DEMO 有在线演示 调用不难 并且相信如果你接触jQuery后肯定也使用或熟悉了不少其插件
现在招聘前端的 会插件开发那是必备的技能
写之前看一看书是必备的

根据《jQuery高级编程》的描述 jQuery插件开发方式主要有三种:
 1.通过$.extend()来扩展jQuery
 2.通过$.fn 向jQuery添加新的方法
 3.通过$.widget()应用jQuery UI的部件工厂方式创建
通常我们使用第二种方法来进行简单插件开发 说简单是相对于第三种方式 第三种方式是用来开发更高级jQuery部件的
该模式开发出来的部件带有很多jQuery内建的特性
比如插件的状态信息自动保存
各种关于插件的常用方法等 非常贴心这个以后有机会我在给大家说道说道 今天先说第一种
而第一种方式又太简单 仅仅是在jQuery命名空间或者理解成jQuery身上添加了一个静态方法而以 在原有的代码上改进出带自己业务的插件
第一种方式 请看例子
程序代码:
$.extend({
    sayHello: function(name) {
        console.log('Hello,' + (name ? name : 'Dude') + '!');
    }
})
$.sayHello(); //调用
$.sayHello('Wayou'); //带参调用
面代码中 通过$.extend()向jQuery添加了一个sayHello函数 然后通过$直接调用 到此你可以认为我们已经完成了一个简单的jQuery插件了
但如你所见 这种方式用来定义一些辅助方法是比较方便的 比如一个自定义的console 输出特定格式的信息 定义一次后可以通过jQuery在程序中任何需要的地方调用它
程序代码:
$.extend({
    log: function(message) {
        var now = new Date(),
            y = now.getFullYear(),
            m = now.getMonth() + 1, //!JavaScript中月分是从0开始的
            d = now.getDate(),
            h = now.getHours(),
            min = now.getMinutes(),
            s = now.getSeconds(),
            time = y + '/' + m + '/' + d + ' ' + h + ':' + min + ':' + s;
        console.log(time + ' My App: ' + message);
    }
})
$.log('initializing...'); //调用
大家所见到或使用的插件也大多是通过此种方式开发 难么? ??????不难 所以有时候你看到有人骄傲的说 我去开发插件去了 没什么大不了的 因为几分钟你也学会





[ 本帖最后由 wangnannan 于 2015-6-10 14:10 编辑 ]
搜索更多相关主题的帖子: 网上 技能 开发 Jquery 在线演示 
2015-06-10 14:09
wangnannan
Rank: 18Rank: 18Rank: 18Rank: 18Rank: 18
等 级:贵宾
威 望:87
帖 子:2545
专家分:9359
注 册:2007-11-3
得分:0 
草根问题 我觉得肯定有人会问
JS插件到底是什么?
插件就是封装好的用以解决某类问题(需求)的JS模块 当然其代码的构成是离开不开函数的

出来混,谁不都要拼命的嘛。 。拼不赢?那就看谁倒霉了。 。有机会也要看谁下手快,快的就能赢,慢。 。狗屎你都抢不到。 。还说什么拼命?
2015-06-10 14:14
wmf2014
Rank: 19Rank: 19Rank: 19Rank: 19Rank: 19Rank: 19
等 级:贵宾
威 望:216
帖 子:2039
专家分:11273
注 册:2014-12-6
得分:0 
 

能编个毛线衣吗?
2015-06-10 15:23
hu9jj
Rank: 20Rank: 20Rank: 20Rank: 20Rank: 20
来 自:红土地
等 级:贵宾
威 望:396
帖 子:11713
专家分:43267
注 册:2006-5-13
得分:0 
跟在后面学

活到老,学到老! http://www. E-mail:hu-jj@
2015-06-10 18:55



参与讨论请移步原网站贴子:https://bbs.bccn.net/thread-446424-1-1.html




关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.169244 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved