我的jQuery第十一天 jQuery工具方法

jQeury工具方法

• $.extend() $.fn.extend() $.ajax()

扩展方法

• $.extend() 插件扩展（工具方法）

//    $.extend()
    //    $.fn.extend()
    //1.扩展方法 *** api 没有
    //2.浅层克隆
    //3.深层克隆 
    $.extend({
        definedMandom : function (start, final) {
            // [0, 1] * len + start
            var len = final - start;
            return Math.random() * len + start;
        } 
    }) //加到工具方法里面

    // $.fn.extend() //加到实例方法里面

• $.fn.extend() 插件扩展（实例方法）
• 实例方法拖拽demo

$.fn.extend({
        drag : function () {
            var disX,
                disY,
                self = this;
            $(this).on('mousedown', function (e){
                disX = e.pageX - $(this).offset().left;
                disY = e.pageY - $(this).offset().top;
                $(document).on('mousemove', function (e){
                    $(self).css({left : e.pageX - disX, top : e.pageY - disY})
                });
                $(document).on('mouseup', function (){
                    $(document).off('mousemove').off('mouseup')
                })
            })
            return this;
        }
    })
   $('#demo').drag()

浅层克隆 and 深层克隆

//浅层克隆
 var obj1 = {
            name : "zhou",
            age : 18,
        }
        var obj2 = {
            name : "yang",
            age : 19,
            smoke : true,
            girlFriend : {
                name : "xiaowang",
            }
        }
        var obj3 = {
            name : "wang",
            fortune : 10000000,
        }
        //参数两位到多位,将第二位参数往第一位参数克隆，原始值重复的直接覆盖，没有的添加进去
       $.extend(obj1, obj2)
//深层克隆，在需要在最前面在添加一个参数truel
//以让不共用一个引用值
$.extend(true,obj1, obj2)

$.ajax()

        //参数 obj 
        //属性 url : 'https://open.duyiedu.com/jq/person'
        // type : 请求方式
        // data : {} 参数，信息
        // success : 请求成功后处理函数
        // error : 请求失败后的处理函数
        // complete : 请求完成的处理函数 最后执行
        // context : 改变函数上下文
        // timeout : 
        // async :true false 是否同异步
        // dataType : 'jsonp'
    $.ajax({
        url : 'https://open.duyiedu.com/jq/person',
        type : 'GET',
        // async : false,
        // dataType : 'jsonp',
        // data : {
        //     username : 'zhou',
        //     passwrod : '123456'
        // }
        success : function (res) {
            $.each(res.data, function(index, ele){
                console.log(ele);
            })
        },
        error : function (e) {
            console.log(e.status, e.statusText)
        },
        complete : function () {
            // 
        },
        context : $('.wrapper'),
    })
    console.log('over')