jquery中attr和prop的区别

Posted 2020-09-22 小_Li_Kelly

之前在工作中遇到$("input[name=checkbox]").attr("checked") == undefined 获取不到值的问题。

• 对于html元素本身就带有的固有属性，在处理时，使用prop方法比如href,class等。
• 对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法，比如自定义的data-id属性。使用prop方法取值和设置属性值时，都会返回undefined值。
• 对于checkbox，radio和select这样的元素，选中属性对应“checked”和“selected”，这些也属于固有属性，因此需要使用prop方法去操作才能获得正确的结果。

• $("input[name=checkbox]").prop("checked") == false
  
  $("input[name=checkbox]").prop("checked") == true
  

• 倘若使用attr
  

• $("input[name=checkbox]").attr("checked") == undefined
  
  $("input[name=checkbox]").attr("checked") == "checked"