今天在使用data获取属性并且赋值时遇到一个小问题,写下来防止以后再跳坑。

在使用jQuery获取自定义属性值时,我们习惯用

$(selector).attr('data-value');

jQuery赋值:

$(selector).attr('data-value','123456');

而data的取值:

$(selector).data('value');

data赋值:

$(selector).data('value','123456');

值得注意的是data,如果决定使用data就不要再使用attr,交叉混用是拿不出值的。因为data是单项绑定,返回的数据不会实时更新到dom。

如果真的需要更新dom上的自定义属性值,那只能把data取出的值放入attr中,感觉很麻烦不是吗?

另一个小坑,如果dom中赋值是一个字符串true,使用data取出的却是boolean true。

关于jQuery中的attr和data问题的更多相关文章

  1. jQuery中prop() , attr() ,css() 的区别

    1.  HTML属性是指页面标记中放在引号中的值,而DOM属性则是指通过JavaScript能够存取的值. (1)在jQuery中,prop()是操作DOM属性,attr()是操作HTML属性. HT ...

  2. jquery checkbox反复调用attr('checked', true/false)只有第一次生效 Jquery 中 $('obj').attr('checked',true)失效的几种解决方案

    1.$('obj').prop('checked',true) 2. $(':checkbox').each(function(){ this.checked=true; }) 为什么:attr为失效 ...

  3. jQuery中 prop() attr()使用详解

    对于HTML元素本身就带有的固有属性,在处理时,使用prop方法.  对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法. 在高版本的jquery引入prop方法后,什么时候该用p ...

  4. Jquery 中 $('obj').attr('checked',true)失效的几种解决方案

    转载自:搜狐博客 大拙无为 1.$('obj').prop('checked',true) 2. $(':checkbox').each(function(){ this.checked=true; ...

  5. jQuery中的attr()和prop()使用

    总结:除了checked.seleted这样的属性推荐用prop()外,其他的随意都可以. 原因如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML ...

  6. jquery中的attr()与prop()的区别

    根据官方的建议:具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()

  7. jquery中的attr与prop的区别,什么时候用attr,什么时候用prop

    只要有 Boolean() 属性的,简单说就是具有true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),(其实这些都是表单类的), ...

  8. jquery中的attr与prop

    http://www.cnblogs.com/Showshare/p/different-between-attr-and-prop.html

  9. jQuery中attr()、prop()、data()用法及区别

    .attr(),此方法从jq1.0开始一直存在,官方文档写的作用是读/写DOM的attribute值,其实1.6之前有时候是attribute,有时候又是property..prop(),此方法jq1 ...

随机推荐

  1. SQL Server 本地时间和UTC时间的相互转换的代码

    DECLARE @LocalDate DATETIME, @UTCDate DATETIME, @LocalDate2 DATETIME   SET @LocalDate = GETDATE() SE ...

  2. HTML5 JavaScript 文件上传

    function fileUpload(targetUrl) { // 隐藏表单名称 var inputName = '_fileselect'; // 文件尺寸 this.fileSize = 0; ...

  3. 在virtualenv中安装libxml2和libxslt

    在使用python的工作中,需要使用到libxml2和libxslt库.原来在实际环境中已经安装完成了,但是在virtualenv中还没有,现在正在整理virtualenv的环境.下面把在virtua ...

  4. python bottle 框架开发任务管理系统 V_1.0版

    经过1-2个星期的开发,现在开发了个半成品(UI现在比较烂,因为我的前端本来就很差,将就下吧),大概功能如下:用户功能(添加.删除.修改),添加部门功能,任务管理功能(添加.删除.修改,详细).项目管 ...

  5. C语言编译过程简介

    刚开始接触编程的时候,只知道照书敲敲代码,一直都不知道为什么在windows平台下代码经过鼠标那样点击几下,程序的结果就会在那个黑色的屏幕上.现在找了个机会将C语言的编译原理做一下小小的总结,这样也能 ...

  6. Linux服务器配置WEB应用日志文件到指定目录

    在Linux服务器上配置WEB应用程序日志到指定文件   服务器环境是 RedHat Linux, 其上运行的是 Apache + Tomcat,容器中运行的是我们公司的壹个小型电子商务网站,原来项目 ...

  7. Keil C51 Data Overlaying

    一般的编译器将函数中的区域变数动态配置在stack,等函数结束空间就释放出来.因为8051 的内部记忆体很少,只有区区128 或256 bytes,而且stack 也是共用这块记忆体.为了节省stac ...

  8. 类:初识类的事件(有点不明白,怎么普通Precedure可以赋值给TEvent)

    先勾画一下思路:1.建立一个类, 里面有年龄字段 FAge;2.通过 Age 属性读写 FAge;3.如果输入的年龄刚好是 100 岁, 将会激发一个事件, 这个事件我们给它命名为: OnHundre ...

  9. 《how to design programs》第11章自然数

    这章让我明白了原来自然数的定义本来就是个递归的过程. 我们通常用枚举的方式引出自然数的定义:0,1,2,3,等等(etc).最后的等等是什么意思?唯一能把等等从描述自然数的枚举方法中去除的方法是自引用 ...

  10. 【转】飞凌嵌入式(Forlinx)TE/OK6410内核编译:“make: arm-none-linux-gnueabi-gcc:命令未找到”

    原文网址:http://www.xuebuyuan.com/1104711.html Ubuntu10.04下编译飞凌嵌入式(Forlinx)TE/OK6410开发板提供的内核2.6.36 本以为按照 ...