jquery中attr和prop的区别

    在系统中想判断一个CheckBox是否选中，当选中时执行一系列操作。想让弹出CheckBox当前的状态。首先我使用的attr属性来判断当前的状态，但是代码不执行，后来发现判断直接没有操作。

    jQuery文档中，attr和prop的参数都是一样的，而这两个东西都被认为是属性，那么他们之间到底有什么区别呢？下面我们一起验证下。

attr与prop的全称

attr全称attribute(属性)

prop全称property(属性)

虽然都是属性，但他们所指的属性并不相同，attr所指的属性是HTML标签属性，而prop所指的是DOM对象属性，可以认为attr是显式的，而prop是隐式的。

html代码：

<input id="test" type="checkbox"/> 

js代码

$("#test").attr("checked") // undefined  
$("#test").prop("checked") // false 

可以看到attr获取一个标签内没有的东西会得到undefined，而prop获取的是这个DOM对象的属性，因此checked为false。

我们继续看，加上checked属性后。

html代码：

<input id="test" type="checkbox" checked/> 

js代码：

$("#test").attr("checked") // checked  
$("#test").prop("checked") // true  

    总结： prop是在jQuery高版本的时候才引入的，什么时候该用prop？什么时候用attr？它们两个之间有什么区别？使用场景。

1、对于HTML元素本身就带有的固有属性，只存在true/false的属性在处理时，使用prop方法。prop不支持自定义属性。

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