jQuery学习中 attr() 和 prop() 的区别
下午在做一个表单，用的是 jquery.2.1.4.js 想实现checkbox 全选、全不选、反选的时候总是出问题。全不选是没问题，单当再次点击全选的时候属性值是变了，但是页面没有任何效果。当时看了很长时间没发现问题，然后在网上查了一下原来是在 jQuery版本更新的时候有了一个新的方法 porp() 。
仔细对比了一下两者的区别。
jquery1.6中新加了一个方法prop()。有的浏览器只要写disabled，checked就可以了，而有的要写成disabled = "disabled"，checked="checked"，比如用attr("checked")获取checkbox的checked属性时选中的时候可以取到值,值为"checked"但没选中获取值就是undefined。
jq提供新的方法“prop”来获取这些属性，就是来解决这个问题的，以前我们使用attr获取checked属性时返回"checked"和"",现在使用prop方法获取属性则统一返回true和false。
那么，什么时候使用attr()，什么时候使用prop()？
1.添加属性名称该属性就会生效应该使用prop();
2.是有true,false两个属性使用prop();
3.其他则使用attr();
项目中jquery升级的时候大家要注意这点！
以下是官方建议attr(),prop()的使用：
| Atrribute/Property | .attr() | .prop() |
|---|---|---|
| accesskey | √ | |
| align | √ | |
| autofocus | √ | √ |
| async | √ | √ |
| checked | √ | √ |
| class | √ | |
| contenteditable | √ | |
| draggable | √ | |
| href | √ | |
| id | √ | |
| label | √ | |
| location ( i.e. window.location ) | √ | √ |
| multiple | √ | √ |
| readOnly | √ | √ |
| rel | √ | |
| selected | √ | √ |
| src | √ | |
| tabindex | √ | |
| title | √ | |
| type | √ | |
| width ( if needed over .width() ) | √ |
由此可以看出像checkbox，radio和select这样的元素，选中属性对应checked selected multiple autofocus，这些属于固有属性，因此需要使用prop()方法去操作才能获得正确的结果。
$("#chk1").prop("checked") == false
$("#chk2").prop("selected") == true
