0
点赞
收藏
分享

微信扫一扫

JS中radio,checkbox在控制选中不选中使用attr和prop方法的区别

Xin_So 2022-01-12 阅读 58

问题:

使用jquery选中radio时,$("#mycheckbox").attr("checked","checked")能选中样式,但没有加上css属性,无法控制checked属性。

解决办法:

分析:

综合官网上的解释,在jquery1.6.1在以后,由于原理的attr管理的东西太多,所以把一些属性分出来给了prop,解决了兼容性的问题。

一、attr、prop分别是attribute、property的缩写,分别对应DOM和js对象的属性。

attr的源代码是,obj.setAttribute(attrname,attrvalue),参数值都是string

prop的源码是,  obj[property]=value,参数值可以使object

二、若打印日志,你会发现,有些DOM属性与js对象属性名字一样,有些不一样。DOM与js对象都有id属性,而DOM的class属性,在js对象中叫className。attr和prop既有各自的独立数据,也有共享数据。当操作独立数据时,互不影响,操作共享数据时,对对方有影响。

上述代码在pc端能正常运行,在移动端就有问题。

三、boolean attr,比如:checked,仅被设置成默认值或初始值。在一个checkbox的元素中,checked attributes在页面加载的时候就被设置,而不管checkbox元素是否被选中。

properties就是浏览器用来记录当前值的东西。正常情况下,properties反映它们相应的attributes(如果存在的话)。但这并不是boolean attriubutes的情况。当用户点击一个checkbox元素或选中一个select元素的一个option时,boolean properties保持最新。但相应的boolean attributes是不一样的,正如上面所述,它们仅被浏览器用来保存初始值。

四、对于selected、checked、disabled等属性,使用prop。自jquery1.6后,attr用于获取dom属性的初始状态值,对于返回boolean类型的属性,比如selected、checked、disabled使用prop。

举报

相关推荐

0 条评论