jquery attr和prop区别

问题再现

使用jquery选中checkbox时，只有鼠标点击后，才起作用，之后就不起作用，$(“#mycheckbox”).attr(“checked”,true)
后来搜到很多说明，说是jquery版本的缘故，要用prop，这个理由很笼统，我还是没懂attr和prop之间的区别。看了很多帖子后，总结出以下原因。

代码

<div id="mydiv" class="myclass" customattr="mycustomattr">div内容</div><script type="text/javascript">var tempvar = document.getElementById("mydiv");console.log(tempvar);</script>

attr和prop不同

表达意义不同

attr是attribute缩写，对应html网页中的属性。

如div中的id、class、customattr就是attribute，反应到js的变量就是attributes属性

prop是property的缩写，对应js对象的属性。

accesskey、align、attributes、dir、className等都是property

共享数据互相影响；独立数据互不影响

attr和prop既有共享数据，也有独立数据，操作独立数据时，互不影响；操作共享数据时，会有影响。
共享数据：比如，id、class在attribute中存在，也在property存在，不过class在property中叫className
独立数据：customattr只属于attribute，不属于property，即使property定义了一个customattr，两者也不互相影响

jquery 1.6之前用attr；之后分开使用；

attr和prop使用版本不同，jquery1.6之前只有attr，jquery1.6之后才有prop。
attr的源代码是，obj.setAttribute(attrname,attrvalue),参数值都是string，直接反映到html dom上
prop的源码是, obj[property]=value，参数值可以使object，修改的内存值

boolean类型属性使用prop

对于selected、checked、disabled等boolean类型属性，使用prop。自jquery1.6后，attr只用于获取boolean类型属性的初始值，并且不受当前值影响。

总结

• 内建的共同属性，用attr、prop都可以，他们会互相影响。比如，id、class、name
• boolean类型的属性用prop，attr用来获取初始值
• 独立的属性，使用各自的方法；attr创建的属性就用attr，prop创建的属性就用prop