转载 JQuery.data()方法学习

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

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

 1 <!doctype html>
 2 <html>
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>返回值:jQuerydata([key],[value])</title>
 6 </head>
 7 <body>
 8     <!-- demo3 data方法的使用 -->
 9     <a href="javascript:;" id="demo3">demo3</a>
10     <div></div>
11     <button id="clear">clear</button>
12     <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.8.3/jquery.min.js"></script>
13     <script type="text/javascript">
14         /**
15          *返回值:jQuerydata([key],[value])
16          *key:存储的数据名
17          *value:将要存储的任意数据
18          *
19          *在元素上存放数据,返回jQuery对象。
20          *V1.4.3 新增用法NEW data(obj) 可传入key-value形式的数据。
21          *
22          */
23         $(document).ready(function(){
24             /**
25              * demo3
26              */
27             $("#demo3").click(function(){
28                 //赋值
29                 $(this).data("value","hanchao");
30                 //取值
31                 var value = $(this).data("value");
32                 console.log(value);
33                 //重新赋值
34                 $(this).data("value",78);
35                 //重新取值
36                 var value_new = $(this).data("value");
37                 console.log(value_new);
38                 //赋值一个对象
39                 $(this).data("user",{username:"tom",password:"123456",address:"China"});
40                 //取值
41                 var username = $(this).data("user").username;
42                 var password = $(this).data("user").password;
43                 var address = $(this).data("user").address;
44                 console.log("username:" + username + ", password:" + password + ", address:" + address);
45                 //我们还可以把值放在一个div中
46                 $("div").data("test",{username:"tom",password:"123456",address:"China"});
47                 //取值
48                 var username1 = $("div").data("test").username;
49                 var password1 = $("div").data("test").password;
50                 var address1 = $("div").data("test").address;
51                 console.log("username1:" + username1 + ", password1:" + password1 + ", address1:" + address1);
52             });
53             /**
54              * [ description] 清除div中的data数据
55              * @return {[type]}
56              */
57             $("#clear").click(function(){
58                 $("div").removeData("test");
59                 //取值
60                 var username = $("div").data("test");
61                 console.log("username1:" + username);
62             });
63         });
64     </script>
65 </body>
66 </html>
原文地址:https://www.cnblogs.com/wphl-27/p/5844338.html