拓展你的jQuery!

extend函数

$.extend(target,[object1],[onjectN])

$.extend([deep],target,object1,[objectN])

            var obj1={
                height:100,
                width:100,
                length:100,
                div:{x:100,y:100}
            }
            var obj2={
                height:200,
                width:200,
                div:{x:200}
            }
            $.extend(obj1,obj2)
            console.log(obj1.height)
            console.log(obj1.div.y)
            //result:200,undefined

当使用true参数时,

            var obj1={
                height:100,
                width:100,
                length:100,
                div:{x:100,y:100}
            }
            var obj2={
                height:200,
                width:200,
                div:{x:200}
            }
            $.extend(true,obj1,obj2)
            console.log(obj1.height)
            console.log(obj1.div.y)
            //result:200,100

拓展jQuery的公共函数

            $.extend({
                minValue:function(a,b){
                    return a>b?a:b
                }
            })
            var a = prompt("input a")
            var b = prompt("input b")
            console.log($.minValue(a,b))

$.fn.extend()方法可以创建jQuery对象方法

            $.fn.extend({
                test:function(){
                    alert("click "+$(this).html()+" this is test function")
                }
            })
            $("#fnExtend").click(function(){
                $(this).test()
            })

自定义jQuery函数

添加新的全局函数

            $.clickDiv=function(node){
                console.log(node.text()+" click")
            }
            $("div").click(function(){
                $.clickDiv($(this))  
            })

通过extend函数添加全局函数

            $.extend({
                foo:function(){
                    alert("this is a new function 'foo()'")
                }
            })
            $.foo()

使用命名空间

            $.myPluin={
                ale:function(){
                    alert("function from myPluin")
                }
            }
            $.nextPluin = {
                ale:function(){
                    alert("function from nextPluin")
                }
            }
            $.myPluin.ale()
            $.nextPluin.ale()

自定义选择器

            index=-1  //定义全局变量index
            jQuery.expr[":"].le=function(elem,i,match){
                //return i>match[3]-0||i==match[3]
                console.log(index)
                index++
                return index>match[3]-0  //返回索引大于3的元素

            }
            $("p:le(2)").css("color","red")
            //返回元素索引值大于等于2的元素
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值