Jquery的attr和prop的区别

描述：想做一个复选框checkbox全选的功能，当勾选全选后，将子项的复选框状态设置成一致的，

但遇到了一个问题，就是attr函数并不能改变子项的checkbox的状态，而换成prop函数就可以了。

原因在于attr和prop的区别：我觉得有句话概括的非常好

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

---------对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。

----------------来自〖芈老头〗的技术空间-All For Better Codes

就拿我的代码做例子：

jsp：

<th>

<label class="am-checkbox"> <input type="checkbox" id="selectAll" data-am-ucheck> 全选 </label>

</th>

<c:forEach items="${pb.beanList }" var="product">

<tr class="even gradeC">

<td>

<label class="am-checkbox"> <input type="checkbox" value="${product.productId }" name="checkboxBtn" data-am-ucheck> </label>

</td>

</tr>

</c:forEach>

js：

$(function() {

	/*

	 * 给全选添加click事件

	 */

	$("#selectAll").click(function() {

		/*

		 * 1. 获取全选的状态

		 */

		var bool = $("#selectAll").prop("checked");

		/*

		 * 2. 让所有条目的复选框与全选的状态同步

		 */

		setItemCheckBox(bool);

	});

});

/*

 * 统一设置所有条目的复选按钮

 */

function setItemCheckBox(bool) {

	$(":checkbox[name=checkboxBtn]").prop("checked", bool);

}

checkbox选中属性对应“checked”，属于固有属性，因此需要使用prop方法去操作才能获得正确的结果，如果用attr则会出现undefined这样的错误。

所以说，要分清属性的情况再选择用prop还是attr。用错的话就会出现undefined这样的错误。