转载原地址  http://hanchaohan.blog.51cto.com/2996417/1271551

转载时请务必以超链接形式标明文章 原始出处 、作者信息和本声明。否则将追究法律责任。http://hanchaohan.blog.51cto.com/2996417/1271551

 <!doctype html>

 <html>

 <head>

     <meta charset="UTF-8">

     <title>返回值:jQuerydata([key],[value])</title>

 </head>

 <body>

     <!-- demo3 data方法的使用 -->

     <a href="javascript:;" id="demo3">demo3</a>

     <div></div>

     <button id="clear">clear</button>

     <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.8.3/jquery.min.js"></script>

     <script type="text/javascript">

         /**

          *返回值:jQuerydata([key],[value])

          *key:存储的数据名

          *value:将要存储的任意数据

          *

          *在元素上存放数据,返回jQuery对象。

          *V1.4.3 新增用法NEW data(obj) 可传入key-value形式的数据。

          *

          */

         $(document).ready(function(){

             /**

              * demo3

              */

             $("#demo3").click(function(){

                 //赋值

                 $(this).data("value","hanchao");

                 //取值

                 var value = $(this).data("value");

                 console.log(value);

                 //重新赋值

                 $(this).data("value",78);

                 //重新取值

                 var value_new = $(this).data("value");

                 console.log(value_new);

                 //赋值一个对象

                 $(this).data("user",{username:"tom",password:"123456",address:"China"});

                 //取值

                 var username = $(this).data("user").username;

                 var password = $(this).data("user").password;

                 var address = $(this).data("user").address;

                 console.log("username:" + username + ", password:" + password + ", address:" + address);

                 //我们还可以把值放在一个div中

                 $("div").data("test",{username:"tom",password:"123456",address:"China"});

                 //取值

                 var username1 = $("div").data("test").username;

                 var password1 = $("div").data("test").password;

                 var address1 = $("div").data("test").address;

                 console.log("username1:" + username1 + ", password1:" + password1 + ", address1:" + address1);

             });

             /**

              * [ description] 清除div中的data数据

              * @return {[type]}

              */

             $("#clear").click(function(){

                 $("div").removeData("test");

                 //取值

                 var username = $("div").data("test");

                 console.log("username1:" + username);

             });

         });

     </script>

 </body>

 </html>

转载 JQuery.data()方法学习的更多相关文章

  1. html 5 data-* (dataset) 属性和 jquery data方法比较

    一些文章在介绍html 5 data-* (dataset)属性时,会提到jquery的data方法,认为data方法能够很好的利用html 5的这个特性.但实际上,二者的兼容性是很差的.下面给出一段 ...

  2. JQuery data方法的使用-遁地龙卷风

    (-1)说明 我用的是chrome49,这个方法涉及到JQuery版本问题,我手里有3.0的,有1.9.1,后面将1.9.1及其以前的称为低版本,3.0称为高版本 测试例子用到的showMessage ...

  3. jquery data方法取值与js attr取值的区别

    <a data-v="3"></a> jquery data方法的运行机制: 第一次查找dom,使用attributes获取到dom节点值,并将其值存到缓存 ...

  4. jquery data方法获取某个元素上事件

    获取某个元素上的事件,jquery的给元素绑定的事件可以用data方法取出来. 通过$(element).data("events")来获取 // 比如给一个button绑定两个c ...

  5. jquery data方法

    jquery.data()文档:http://api.jquery.com/jQuery.data/ html5有个data-*属性,跟这个功能一样. Note: This is a low-leve ...

  6. jQuery 数据 - jQuery.data() 方法

    打印出 hi

  7. HTML5 自定义属性 data-* 和 jQuery.data 详解

    新的HTML5标准允许你在普通的元素标签里,嵌入类似data-*的属性,来实现一些简单数据的存取.它的数量不受限制,并且也能由javascript动态修改,也支持CSS选择器进行样式设置.这使得dat ...

  8. jquery.data()&jquery.extend()

    JQuery.data()方法 Jquery提供的在节点存取数据的方法. var $el = $('#app'); //使用键值对的方式存数据 $el.data('name', 'jinx'); $e ...

  9. Jquery 扩展方法实现原理

    JSONP原理 首先:JSON和JSONP是不一样的概念. JSON是一种数据交换格式,而JSONP是非正式传输协议. 该协议的一个要点就是允许用户传递一个callback参数给服务端,然后服务端返回 ...

随机推荐

  1. poshytip两个实用示例

    <html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> < ...

  2. Jqgrid入门-显示基本的表格(一)

    首先对Jqgrid网格插件做个简要的说明.在众多的表格插件中,Jqgrid的特点是非常鲜明的.         特点如下: 完整的表格呈现与运算功能,包含换页.栏位排序.grouping.新增.修改及 ...

  3. 用RSA加密实现Web登录密码加密传输

    通常我们做一个Web应用程序的时候都需要登录,登录就要输入用户名和登录密码,并且,用户名和登录密码都是明文传输的,这样就有可能在中途被别人拦截,尤其是在网吧等场合. 这里顺带一个小插曲,我以前有家公司 ...

  4. 【转】JAVA之动态代理

    转自:像少年啦飞驰 代理设计模式 定义:为其他对象提供一种代理以控制对这个对象的访问. 代理模式的结构如下图所示. 动态代理使用 java动态代理机制以巧妙的方式实现了代理模式的设计理念. 代理模式示 ...

  5. POJ 2446 Chessboard (二分图匹配)

    题意 在一个N*M的矩形里,用1*2的骨牌去覆盖该矩形,每个骨牌只能覆盖相邻的两个格子,问是否能把每个格子都盖住.PS:有K个孔不用覆盖. 思路 容易发现,棋盘上坐标和为奇数的点只会和坐标和为偶数的点 ...

  6. 安装oracle XML Database 组件

    近期部署项目数据库,编译包时遇到错误:   PACKAGE CTG.CTG_CSB_COMMON 编译错误  错误:PLS-00201: identifier 'XMLDOM' must be dec ...

  7. 【转】移动web资源整理

    目录(更新于20150311) meta基础知识 H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 忽略将页面中的数字识别为电话号码 忽略Android平台中对邮箱地址的识别 当网站添加到主屏幕快速 ...

  8. Oracle 课程八之跟踪事件set event

    一.Oracle跟踪文件 Oracle跟踪文件分为三种类型: 一种是后台报警日志文件,记录数据库在启动.关闭和运行期间后台进程的活动情况,如表空间创建.回滚段创建.某些alter命令.日志切换.错误消 ...

  9. 典型的 SQL 注入过程(转)

    无意间发现某站点存在 SQL 注入漏洞,于是利用这个漏洞提权并获取服务器控制权.这个案例很典型,像是教科书式的典型入侵步骤,下面就以这个案例展示从 SQL 注入到获取目标服务器控制权限的全过程. 发现 ...

  10. Mondriaan's Dream(POJ 2411状态压缩dp)

    题意:用1*2的方格填充m*n的方格不能重叠,问有多少种填充方法 分析:dp[i][j]表示i行状态为j时的方案数,对于j,0表示该列竖放(影响下一行的该列),1表示横放成功(影响下一列)或上一列竖放 ...