jQuery获取attr()与prop()属性值的方法及区别介绍

对于HTML元素自己就带有的固有属性，在处理时，使用prop方法。

•对于HTML元素咱们本身自定义的DOM属性，在处理时，使用attr方法。

上面的描述也许有点模糊，举几个例子就知道了。 

?

1	<a href= "http://www.baidu.com" target= "_self" class= "btn" >百度</a>

这个例子里<a>元素的DOM属性有“href、target和class"，这些属性就是<a>元素自己就带有的属性，也是W3C标准里就包含有这几个属性，或者说在IDE里可以智能提示出的属性，这些就叫作固有属性。处理这些属性时，建议使用prop方法。

?

1	<a href= "#" id= "link1" action= "delete" >删除</a>

这个例子里<a>元素的DOM属性有“href、id和action”，很明显，前两个是固有属性，然后面一个“action”属性是咱们本身自定义上去的，<a>元素自己是没有这个属性的。这种就是自定义的DOM属性。处理这些属性时，建议使用attr方法。使用prop方法取值和设置属性值时，都会返回undefined值。

再举一个例子：

?

1	<input id= "chk1" type= "checkbox" />是否可见<input id= "chk2" type= "checkbox" checked= "checked" />是否可见

像checkbox，radio和select这样的元素，选中属性对应“checked”和“selected”，这些也属于固有属性，所以须要使用prop方法去操做才能得到正确的结果。

?

1 2	$( "#chk1" ).prop( "checked" ) == false $( "#chk2" ).prop( "checked" ) == true

若是上面使用attr方法，则会出现：

?

1 2	$( "#chk1" ).attr( "checked" ) == undefined $( "#chk2" ).attr( "checked" ) == "checked"