856插件机制
5. 插件:增强JQuery的功能
1. 实现方式:
1. $.fn.extend(object)
增强通过Jquery获取的对象的功能 $("#id")
2. $.extend(object)
增强JQeury对象自身的功能 $/jQuery
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 | <!DOCTYPE html> <html> <head> <meta charset= "UTF-8" > <title>01-jQuery对象进行方法扩展</title> <script src= "../js/jquery-3.3.1.min.js" type= "text/javascript" charset= "utf-8" ></script> <script type= "text/javascript" > //使用jquery插件 给jq对象添加2个方法 check()选中所有复选框,uncheck()取消选中所有复选框 //1.定义jqeury的对象插件 $.fn.extend({ //定义了一个check()方法。所有的jq对象都可以调用该方法 check:function () { //让复选框选中 //this:调用该方法的jq对象 this .prop( "checked" , true ); }, uncheck:function () { //让复选框不选中 this .prop( "checked" , false ); } }); $(function () { // 获取按钮 //$("#btn-check").check(); //复选框对象.check(); $( "#btn-check" ).click(function () { //获取复选框对象 $( "input[type='checkbox']" ).check(); }); $( "#btn-uncheck" ).click(function () { //获取复选框对象 $( "input[type='checkbox']" ).uncheck(); }); }); </script> </head> <body> <input id= "btn-check" type= "button" value= "点击选中复选框" onclick= "checkFn()" > <input id= "btn-uncheck" type= "button" value= "点击取消复选框选中" onclick= "uncheckFn()" > <br/> <input type= "checkbox" value= "football" >足球 <input type= "checkbox" value= "basketball" >篮球 <input type= "checkbox" value= "volleyball" >排球 </body> </html> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | <!DOCTYPE html> <html> <head> <meta charset= "UTF-8" > <title>01-jQuery对象进行方法扩展</title> <script src= "../js/jquery-3.3.1.min.js" type= "text/javascript" charset= "utf-8" ></script> <script type= "text/javascript" > //对全局方法扩展2个方法,扩展min方法:求2个值的最小值;扩展max方法:求2个值最大值 $.extend({ max:function (a,b) { //返回两数中的较大值 return a >= b ? a:b; }, min:function (a,b) { //返回两数中的较小值 return a <= b ? a:b; } }); //调用全局方法 var max = $.max(4,3); //alert(max); var min = $.min(1,2); alert(min); </script> </head> <body> </body> </html> |
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix