最近开发中发现用attr无法设置checkbox的选中事件,在网上找了下说要用prop,所以总结下两者的区别。

1、操作的对象不同

  attr:操作的是HTML文档节点属性

  prop:操作的是js对象属性

2、应用版本不同

  attr()是jQuery 1.0版本就有的函数,prop()是jQuery 1.6版本新增的函数。

  在1.6之前,只能使用attr()函数;1.6及以后版本,你可以根据实际需要选择对应的函数。

3、用于设置的属性值类型不同

  由于attr()函数操作的是文档节点的属性,因此设置的属性值只能是字符串类型,如果不是字符串类型,也会调用其toString()方法,将其转为字符串类型。

  prop()函数操作的是JS对象的属性,因此设置的属性值可以为包括数组和对象在内的任意类型。

4、其他

  使用attr()获取这些属性的返回值为String类型,如果被选中(或禁用)就返回checkedselecteddisabled,否则(即元素节点没有该属性)返回undefined

  并且,在某些版本中,这些属性值表示文档加载时的初始状态值,即使之后更改了这些元素的选中(或禁用)状态,对应的属性值也不会发生改变。

  因为jQuery认为:attribute的checkedselecteddisabled就是表示该属性初始状态的值,

  property的checkedselecteddisabled才表示该属性实时状态的值(值为truefalse)。

因此,在jQuery 1.6及以后版本中,请使用prop()函数来设置或获取checkedselecteddisabled等属性。对于其它能够用prop()实现的操作,也尽量使用prop()函数。

jquery attr与prop的区别与联系的更多相关文章

  1. [jQuery]attr和prop的区别

    转自:http://www.cnblogs.com/Showshare/p/different-between-attr-and-prop.html 在高版本的jquery引入prop方法后,什么时候 ...

  2. 稳固而窒息 jquery attr 和 Prop的区别

    通常在获取或者设置checked,selected,readonly,disabled等的时候使用prop效果更好 attr是通过setAtrribute和getAttribute来设置的,使用的是D ...

  3. jquery中attr和prop的区别、 什么时候用 attr 什么时候用 prop (转自 芈老头 )

    jquery中attr和prop的区别. 什么时候用 attr 什么时候用 prop   在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这 ...

  4. jQuery中.attr()和.prop()的区别

    之前学习jQuery的时候,学习到了两种取得标签的属性值的方法:一种是elemJobj.attr(),另一种是elemJobj.prop().而在学习JS的时候,只有一种方法elemObj.getAt ...

  5. jquery中attr和prop的区别(转)

    在网络上看到这样一篇关于jquery中attr和prop的区别文章,觉得不错,所以转载了. 在jQuery 1.6中,.attr()方法查询那些没有设置的属性,则会返回一个undefined.如果你要 ...

  6. jquery中attr和prop的区别分析

    这篇文章主要介绍了jquery中attr和prop的区别分析的相关资料,需要的朋友可以参考下 在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别 ...

  7. tips:Jquery的attr和prop的区别

    Jquery的attr和prop的区别 描述:想做一个复选框checkbox全选的功能,当勾选全选后,将子项的复选框状态设置成一致的, 但遇到了一个问题,就是attr函数并不能改变子项的checkbo ...

  8. Jquery学习笔记(6)--jquery中attr和prop的区别【精辟】

    jquery中attr和prop的区别 在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这些问题就出现了. 关于它们两个的区别,网上的答案很 ...

  9. 【jQuery 区别】attr()和prop()的区别

    1>>> 今天实现一个 点击更新按钮 ,可以勾选上本行的的checkbox的功能: 使用代码: /** * updateproduct.htmls 更新 产品信息 */ $(docu ...

随机推荐

  1. 我的Java开发学习之旅------>Java利用Comparator接口对多个排序条件进行处理

    一需求 二实现Comparator接口 三验证排序结果 验证第一条件首先按级别排序级别最高的排在前面 验证第二条如果级别相等那么按工资排序工资高的排在前面 验证第三条如果工资相当则按入职年数排序入职时 ...

  2. 前端基础-css(1)

    一.css的引入方式 现在的互联网前端分三层: HTML:超文本标记语言.从语义的角度描述页面结构. CSS:层叠样式表.从审美的角度负责页面样式. JS:JavaScript .从交互的角度描述页面 ...

  3. Android 屏幕切换动画

    public void overridePendingTransition (int enterAnim, int exitAnim) Call immediately after one of th ...

  4. HTML5 canvas绘图基本使用方法

    <canvas></canvas>是HTML5中新增的标签,用于绘制图形,实际上,这个标签和其他的标签一样,其特殊之处在于该标签可以获取一个CanvasRenderingCon ...

  5. ssh远程执行远程执行命令

    ssh zxrac1 '/home/oracle/tmp/t5.sh 2 2 >/dev/null 2>&1 &'

  6. python中math常用函数

    python中math的使用 import math #先导入math包 1 三角函数 print math.pi #打印pi的值 3.14159265359 print math.radians(1 ...

  7. 多线程并发练习(Day35)

    练习一 #_*_coding:utf-8_*_ #!/usr/bin/env python import multiprocessing import threading import socket ...

  8. Delphi 正则表达式语法(8): 引用子表达式 - 也叫反向引用

    Delphi 正则表达式语法(8): 引用子表达式 - 也叫反向引用 //准备: 我们先写一个搜索所有英文单词的表达式 var   reg: TPerlRegEx; begin   reg := TP ...

  9. springmvc 标签

    https://www.baeldung.com/spring-mvc-form-tags     1. Overview In the first article of this series we ...

  10. 用cmd运行php代码、socket

    一.用cmd运行php代码,首先要对电脑进行配置: 1.右击计算机-属性-高级系统设置-环境变量,我们需要添加环境变量. 2.在Administrator的用户变量(U)下点击新建,弹出对话框,变量名 ...