• jquery中attr()和prop()的区别


    jquery中attr()和prop()的区别

    • 最近项目回归使用jquery,页面渲染全是使用jquery做的,所以做的时候也遇到了许多以前没有见过的问题,如这次操作【radio】控件的"checked"属性时有遇到问题,
      $("...").attr("checked",false);无法起到作用,上网查了下使用prop()完美的解决了该问题,特此记录一下。
    1. 官方定义(官方定义是一样的,绕的头晕):

      1. attr():
        attr() 方法设置或返回被选元素的属性和值。
        当该方法用于返回属性值,则返回第一个匹配元素的值。
        当该方法用于设置属性值,则为匹配元素设置一个或多个属性/值对。
      2. prop():
        prop() 方法设置或返回被选元素的属性和值。
        当该方法用于返回属性值时,则返回第一个匹配元素的值。
        当该方法用于设置属性值时,则为匹配元素集合设置一个或多个属性/值对。
    2. 最后的结论是:$('').attr()返回的是html对象;$('').prop()返回的是DOM对象。如果想要修改DOm节点的属性则可以选择prop()方法,我之前就是想让html对象操纵DOM节点导致无法达到想要的效果。

    prop()

    prop()方法操作radio(checkbox)之类的控件,让其选中的时候,其控件选中的值也会随之改变。即既可以控制其选中,也能控制其取消选中;类似于$("...").prop("checked");返回的是true或者false,如果有相应的属性,返回的是该属性,如果没有则返回空串

    attr()

    attr()方法操作radio(checkbox)之类的控件,让其选中的时候,其控件选中的值不会随之改变。即只能控制其选中,不能控制其取消选中;类似于$("...").attr("checked");返回的是'checked'或者undefined如果有相应的属性,返回的是该属性,如果没有则返回undefined。

    attr和prop的使用场景:

    1. 添加属性名称该属性就会生效应该使用prop();
    2. 是有true,false两个属性使用prop();(如'checked','selected','disabled'等)
    3. 其他则使用attr();
    4. 官方推荐使用:
  • 相关阅读:
    ES6新特性
    ng-bind与ng-medol 区别
    验证输入两次密码是否一致angularjs
    最全的node.js安装步骤
    JAVA基础
    localStorage 个人使用总结
    mac中怎么安装python3
    macbook配置homebrew以及安装python3
    python之函数进阶
    mysql数据库入门
  • 原文地址:https://www.cnblogs.com/zhangsansan/p/9050671.html
Copyright © 2020-2023  润新知