jquery的绑定和删除

        // 基本语法形式 $().on( 事件类型 , 事件处理函数 )

        // 删除事件处理函数

        // 必须绑定的是 函数名称 才能删除 绑定的事件处理函数

        // $().off( 事件类型 , 事件处理函数名称 )

        // $('div').on( 'click' , ()=>{

        //     console.log(123);

        // } )

        // 可以同时绑定多个事件类型

        // $('div').on( 'click' , ()=>{console.log(456)}).on( 'mouseover' , ()=>{console.log('我进来了')} ).on('mouseout' , ()=>{console.log('我出来了')})

    

        

        // 必须绑定的是函数名称,才能删除绑定的函数

        $('div').on('click' , fun1).on('click' , fun2).on('click' , fun3);

        // 删除

        $('div').off('click' , fun2);

        

        function fun1(){

            console.log(111)

        }

        function fun2(){

            console.log(222)

        }

        function fun3(){

            console.log(333)

        }

 

// jQuery中事件绑定语法形式2

        // 定义第二个参数:参数是对象的语法形式

        // 第三个参数:事件处理函数中,定义一个形参,一般是 e 或者 event

        //           jQuery会自动向其中存储数据信息

        //           e.data,存储的是参数2,定义的对象

        //           作用就类似于给函数传参

        

        $('div').on('click' ,  {name:'张三' , age:18}  , e=>{

            console.log(e);

        })

 // 事件委托:

        //    是代码编写的一种方式

        //    给父级添加事件,通过判断触发事件的对象,执行不同的程序

        //    解决:动态生成的标签,无法直接获取标签对象

        // 与js方法基本相同,通过触发事件的目标,执行程序

        // $('div').on('click' , e=>{

        //     if(e.target.tagName === 'LI'){

        //         console.log($(e.target).index()+1)  ;

        //     }

        // })

        // jQuery,事件绑定时,可以直接通过设定事件委托

        // 定义触发事件的具体标签对象的条件

        // 这个条件是 jQuery 选择器支持的语法就可以

        $('div').on('click' , 'span' ,e=>{

            console.log('我是span标签');

        })

        $('div').on('click' , '#p1' ,e=>{

            console.log('我是p标签');

        })

        $('div').on('click' , 'ul>li' ,e=>{

            console.log('我是li标签');

        })

        $('div').on('click' , '[name="h1"]' ,e=>{

            console.log('我是h1标签');

        })