attr()和prop()都是设置或返回被选元素的属性和值的方法
他们的共同点是:
当这两个方法用于返回属性值的时候,则返回第一个匹配元素的值。
但是还是有所区别的:
attr:
当该方法用于设置属性值,则为匹配元素设置一个或多个属性/值对。
prop:
当该方法用于设置属性值时,则为匹配元素集合设置一个或多个属性/值对。
通过JQuery官网引入prop之后,就出现了选择的问题,用我的话理解就是:
- 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
- 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。
关于元素固有属性我举个例子:
<a href="http://www.baidu.com" target="_self" class="btn">这是一个a链接标签</a>
这里的href、target和class就是A标签元素本身就带有的属性,这时候我会用prop方法
关于自定义的属性我也举个例子:
<a href="#" id="link1" action="delete">删除</a>
这里href,id是固有的属性,但是action是我自己定义的属性,这时候我会用attr方法。
因为使用attr时候,取值或返回属性值都会undefind
再举一个例子:
<input id="chk1" type="checkbox" />
是否可见
是否可见
像checkbox,radio和select这样的元素,选中属性对应“checked”和“selected”,这些也属于固有属性,因此需要使用prop方法去操作才能获得正确的结果。
$("#chk1").prop(“checked”) == false
$("#chk2").prop(“checked”) == true
如果上面使用attr方法,则会出现:
$("#chk1").attr(“checked”) == undefined
$("#chk2").attr(“checked”) == “checked”