jQuery 文档操作

属性操作

attr(attrName)// 返回第一个匹配元素的属性值
attr(attrName, attrValue)// 为所有匹配元素设置一个属性值
attr({k1: v1, k2:v2})// 为所有匹配元素设置多个属性值
removeAttr(attrName)// 从每一个匹配的元素中删除一个属性

示例:
    设置单个属性
        $(‘.c1‘).attr(‘xx‘,‘oo‘);
    设置多个属性
        $(‘.c1‘).attr({‘age‘:‘18‘,‘sex‘:‘alex‘});
    查看属性
        $(‘.c1‘).attr(‘属性名‘);
        $(‘.c1‘).attr(‘xx‘);
    删除属性
        $(‘.c1‘).removeAttr(‘xx‘);

prop -- 针对的是checked\selected\disabled..

查看标签是否有checked属性,也就是是否被选中
        attr $(‘:checked‘).attr(‘checked‘); //checked -- undefined
        prop $(‘:checked‘).prop(‘checked‘); //true  -- false
        
        通过设置属性的方式来设置是否选中:
            $(‘:radio‘).eq(2).prop(‘checked‘,true);  true和false不能加引号
            $(‘:radio‘).eq(2).prop(‘checked‘,false);

简单总结:
    1.对于标签上有的能看到的属性和自定义属性都用attr
    2.对于返回布尔值的比如checkbox、radio和option的是否被选中或者设置其被选中与取消选中都用prop。
    具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()

文档处理

添加到指定元素内部的后面
    $(A).append(B)// 把B追加到A
    $(A).appendTo(B)// 把A追加到B
    #添加字符串照样能识别标签  *****
    $(‘#d1‘).append(‘<a href="http://www.jd.com">京东</a>‘);
添加到指定元素内部的前面
    $(A).prepend(B)// 把B前置到A
    $(A).prependTo(B)// 把A前置到B
    示例
        $(‘a‘).prependTo($(‘div‘));

添加到指定元素外部的后面
    $(A).after(B)// 把B放到A的后面
    $(A).insertAfter(B)// 把A放到B的后面

添加到指定元素外部的前面
    $(A).before(B)// 把B放到A的前面
    $(A).insertBefore(B)// 把A放到B的前面
    
移除和清空元素
    remove()// 从DOM中删除所有匹配的元素。
    empty()// 删除匹配的元素集合中所有的子节点,包括文本被全部删除,但是匹配的元素还
    $(‘div‘).remove();
    $(‘div‘).empty();

替换
    replaceWith()
    replaceAll()
    示例:
        var a = document.createElement(‘a‘)
        a.href = ‘http://www.baidu.com‘;
        a.innerText = ‘xxx‘;
        
        $(‘span‘).replaceWith(a);
        $(a).replaceAll(‘span‘);
        
clone()克隆
    <button class="btn">屠龙宝刀,点击就送!</button>    

    $(‘.btn‘).click(function () {
        // var a = $(this).clone(); //克隆标签
        var a = $(this).clone(true);  //连带事件一起克隆
        $(this).after(a);

    })

相关推荐