checkbox的:checked与[checked]选择器的区别

最新推荐文章于 2024-08-25 08:00:25 发布

weixin_30237281

最新推荐文章于 2024-08-25 08:00:25 发布

阅读量441

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/hz-blog/p/6879217.html

版权

本文探讨了HTML中的checkbox控件在不同场景下:checked与[checked]选择器的不同表现。阐述了这两种选择器分别对应控件的checked内存变量值与input标签的checked属性，并解释了在AngularJS及label标签内使用时的具体区别。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这个控件，有时候很诡异。选择器:checked与[checked]经常不同步，也就是说只有一个有效，另一个无效。

经过研究发现，:checked选择器选择的是控件自身的checked内存变量值，而[checked]选择的是input标签的checked属性。即jquery中的attr()和prop()的区别。

在angularJS中，ng-checked是通过attr来实现功能的，因此只能用[checked]；而如果你把<input type="checkbox" />放在<label></label>内部，那么点击时attr就不会发生变化，但prop会发生变化，所以就得用:checked。关键是二者并不同步，所以没法通用！

转载于:https://www.cnblogs.com/hz-blog/p/6879217.html