jQuery.prop()、 jQuery.attr()、jQuery.data()方法的用法和区别

jQuery.prop()和 jQuery.attr()方法同样都能够添加属性,但是也是有区别的,一般attr()用的比较频繁,但是有些情况用prop()更为方便。
基本的使用:

    

那么,什么时候使用attr(),什么时候使用prop()?
1.添加属性名称该属性就会生效应该使用prop();
2.是有true,false两个属性使用prop();
3.其他则使用attr();

如下实例,当checked没有在标签中定义的时候,prop就能够获取属性的值。



复选框


checked是true和false时,attr返回属性名,prop返回属性的值



复选框


以上例子看起来还是prop比较直接一点,可以考虑多用用。

补充:JavaScript的getAttribute和 jQuery.attr()的问题

首先看看JavaScript的getAttribute和 jQuery.attr()的差别,我写了两个例子,可以很明确的看出差别:
jQ加载的库是









以上两个例子中getAttribute不能够直接获取改变后的value值,只能获取初始值,而 jQuery.attr()可以;

下面看看jQuery.data()方法


加在data上面的数据只有data能够取到,相当于所有的data上面的数据都在一起,方便保存和使用。

 $(function(){
        $("div").data("aaa","bbb");
        $("div").attr("aaa","ccc");
        console.log($("div").data('aaa'));//bbb
        console.log($("div").attr('aaa'));//ccc
    });

尽管变量名相同的情况下,也不会受到影响。

你可能感兴趣的:(jQuery.prop()、 jQuery.attr()、jQuery.data()方法的用法和区别)