最近在写一个关于checkbox全选与取消全选的优化方法时,看到很多高手用到了.prop()。
于是在jquery的帮助文档查了一下,才知道这是在jquery 1.6.1中新加的方法,用来设置属性。但已经有了attr(),为何还要加入prop()呢?于是查阅了一下相关文档,总结一下。
下面主要写一下它们在何种情况下被使用: 一、checked,selected,readonly和disabled在1.6.1中和1.6之前的处理相同,也就是说还是直接用attr()即可,如
          $(“:checkbox”).attr(“checked”, true);
$(“option”).attr(“selected”, true);
$(“input”).attr(“readonly”, true);
$(“input”).attr(“disabled”, true);
    甚至是这样的代码:
 
          if ( $(“:checkbox”).attr(“checked”) ) { /* Do something */ } 
    都是可以在1.6以上的jquery中正常运行的,但有一些bug,在下面讲到。

   二、下面的.attr()的例子,虽然在jQuery 1.61之前的版本中能正常工作,但是现在必须使用.prop()方法代替:
     
                 .attr                                     .prop
        $(window).attr() $(window).prop()
        $(document).attr() $(document).prop()
       $(':checkbox').attr('checked',true) $(':checkbox').prop('checked',true)
       $('option').attr('selected',true) $('option').prop('selected',true)
  首先,window或document中使用.attr()方法在jQuery1.6中不能正常运行,因为window和document中不能有attributes。它们包含properties(比如:location或readyState),必须使用.prop()方法操作或简单地使用javascript原生的方法。 在jQuery1.6.1中,window和document中使用.attr()将被自动转成使用.prop(还没试过)。其次,checked,selected和前面提到的其它boolean attributes,因为这些attributes和其相应的properties之间的特殊关系而被特殊对待。通常,attribute 就是以下html代码中看到的,如: 
              <input type=”checkbox” checked=”checked”>
但它仅表示checked属性在页面加载的时候被设置成默认值或初始值,而不管checkbox元素是否被选中。 而通常 properties 是一个浏览器用来记录当前属性值的东西。正常情况下,properties反映它们相应的attributes。
所以,当用户点击一个checkbox元素或选中一个select元素的一个option时,使得properties保持最新,但对应的attributes却不一定,它仅被浏览器用来保存该属性的初始值。
在jQuery1.6中,如果使用下面的方法设置checked:
              $(“:checkbox”).attr(“checked”, true);
将不会检查checkbox元素,因为它是用来设置属性的,但是设置的都是初始值。
综合,我觉得,在设置这些prioerties时,使用prop(),而在获取初始化的值是使用attr()。
下面是jQuery1.6.1支持的使用.attr()动态地取得和设置boolean attributes/properties的完整列表: autofocus, autoplay, async, checked, controls, defer, disabled, hidden, loop, multiple, open, readonly, required, scoped, selected 当然,代码仍然可以在jQuery1.6.1中正常运行,还是建议使用.prop()方法来设置这些boolean attributes/properties.

jQuery 1.6+ 中attr()与prop() 区别的更多相关文章

  1. jQuery中attr()与prop()区别介绍

    .attr() : 获取匹配的元素集合中的第一个元素的属性的值 或 设置每一个匹配元素的一个或多个属性. •.attr( attributeName ) •.attr( attributeName ) ...

  2. jquery中attr()与prop()区别

    我们知道jquery中获取元素属性有两种常见的方法,一个是attr()方法,这个是用的比较多的,也是我们第一个想到的.另外一个就是prop()方法了,这个方法之前很少用到,它是jquery1.6之后新 ...

  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的attr()方法 jquery中用attr()方法来获取和设置元素属性,attr是a ...

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

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

  8. jQuery中attr和prop方法的区别说明

    jquery中attr和prop的基本区别可以理解为:如果是内置属性,建议用prop,如果是自定义的建议用attr. 例如 <input type=check  node=123 id=ck & ...

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

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

随机推荐

  1. java中的“包”与C#中的“命名空间

    原文地址:http://www.cnblogs.com/lidabo/archive/2012/12/15/2819865.html Package vs. Namespace 我们知道,重用性(re ...

  2. char和int的转换

    import java.util.Scanner; public class test7 { public static void main(String[] args) { // TODO Auto ...

  3. spring mvc json 返回乱码问题解决(vestion:3.x.x)

    本文是转载文章,感觉比较好,如有侵权,请联系本人,我将及时删除. 原文网址:<spring mvc json 返回乱码问题解决(vestion:3.x.x)> 工程中用springmvc返 ...

  4. java反射--注解的定义与运用以及权限拦截

    自定义注解类编写的一些规则: 1. Annotation型定义为@interface, 所有的Annotation会自动继承java.lang.Annotation这一接口,并且不能再去继承别的类或是 ...

  5. android与javascript相互调用

    下面这一节来介绍android和javascript是怎么相互调用的,这样我们的UI界面设计起来就简单多了,而且UI设计起来也可以跨平台.现在有好多web app前台框架了,比如sencha和jque ...

  6. 大学生程序猿IT情书“2014爱的告白挑战赛”获奖名单及优秀情书展示系列之 - 【IT术语】情书+【搞笑另类】情书

    经过专家评委们的层层精心评选和认真讨论,恭喜下面同学终于入选CSDN高校俱乐部"大学生程序猿IT情书2014爱的告白挑战赛活动"优胜者名单.获奖者将在本周内收到邮件通知.请依照邮件 ...

  7. Java基础知识强化62:Arrays工具类之概述和使用

    1. Arrays工具类: Arrays这个类包含操作数组(比如排序和查找)的各种方法. 2. Arrays的方法: (1)toString方法:把数组转成字符串 public static Stri ...

  8. SELinux 与强制访问控制系统

    SELinux 全称 Security Enhanced Linux (安全强化 Linux),是 MAC (Mandatory Access Control,强制访问控制系统)的一个实现,目的在于明 ...

  9. DC综合流程

    Design Compiler and the Design Flow 步骤 将HDL描述的设计输入到Design Compiler中 Design Compiler使用technology libr ...

  10. 网页HTML

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...