1.21

48 阅读1分钟

/* prop是获取元素自身的属性 attr是获取元素的自定义属性 */

$('#lan').click(function(){

checkFn.call(this,'我爱篮球',$('h1'))

}) $('#zu').click(function(){

checkFn.call(this,'我爱足球',$('h1'))

}) function checkFn(aihao,obj){ if($(this).prop('checked')){ obj.append(aihao); } else{ let t= obj.text(); let n=t.replace(aihao,''); obj.text(n)

}

}

    $('p').attr('data-a')/* 获取属性 */
    $('p').attr('data-b','wwwwwwww')/* 设置属性 */
    /* 设置图片属性 */
    $('img').attr('width','10px')
    /* 删除图片属性 */
    $('img').click(function(){
        $(this).removeAttr('width')/* 这样点击时就删除了设置的宽度 */
    })    // /*remove()删除整个节点,是可以自己删除自己的  */
    // $('button').click(function(){
    //     $('li:eq(0)').remove();
    // })

    
    /* empty清空节点内容,并没有删除节点 */
    // $('button').click(function(){
    //     $('li:eq(0)').empty();
    // })

    /* detach()删除整个节点,保留元素绑定事件,附加的数据 */
    // $('li:eq(0)').click(function(){
    //     alert('你好')
    //     })
    //     $('button').click(function(){
    //         $('li:eq(0)').detach();
    // })

    /* 替换节点replaceWith() */
     $('button').click(function(){
         let h=$('<h1>wwwww</h1>')
         /* 用h1来替换第一个li */
        // $('li:eq(0)').replaceWith(h)
        /* 同样也是替换 */
        // h1.replaceAll($('li:eq(0)'))


        /* clone是复制,true复制事件处理,false反之。false或者不传参数都不能复制事件处理 */
        let cloneLi=$('li:eq(0)').clone(true);
        $('ul').append(cloneLi)
    })

/* 用于获取位于匹配元素前面和后面的'所有所有所有'同辈元素 siblings() 除了他自己*/ // let ls=(.yu).siblings()('.yu').siblings() ('li').click(function () { $(this).css('background', 'red').siblings().css('background', ''); })/* 点击有背景,其他无背景 */

    // /* 用于获取紧临匹配元素之后的元素next() */
    // /* 有多个.yu的话就会返回一个紧临匹配元素之后的元素集合 */
    // let d=$('.yu').next();


    // /*用于获取紧临匹配元素之前的元素prev()  */
    // let d=$('.yu').prev();



    // /* children()方法可以用来获取元素中所有元素 */
    // let lis = $('ul').children('.tt')/* 这样就单独获取到了class为tt的 */
    // let c = $('.box').children('ul')
    // /* 而find可以获取后代的元素 */
    // $('.box').children('li')