jQuery提供的存储接口

jQuery.data( element, key, value )   //静态接口,存数据
jQuery.data( element, key ) //静态接口,取数据
.data( key, value ) //实例接口,存数据
.data( key ) //实例接口,存数据
 <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title></title>
<style>
.left,
.right {
width: 300px;
height: 120px;
}
.left div,
.right div {
width: 100px;
height: 90px;
padding: 5px;
margin: 5px;
float: left;
border: 1px solid #ccc;
}
.left div {
background: #bbffaa;
}
.right div {
background: yellow;
}
</style>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
<h2>jQuery.data()静态方法</h2>
<div class="left">
<div class="aaron">
<p>点击看结果</p>
<p>jQuery.data</p>
</div>
<div><span></span></div>
</div>
<h2>.data()实例方法</h2>
<div class="right">
<div class="aaron">
<p>点击看结果</p>
<p>.data</p>
</div>
<div><span></span></div>
</div>
<script type="text/javascript">
$('.left').click(function() {
var ele = $(this);
//通过$.data方式设置数据
$.data(ele, "a", "data test1")
$.data(ele, "b", {
name : "data test2"
})
//通过$.data方式取出数据
var reset = $.data(ele, "a") + "</br>" + $.data(ele, "b").name
ele.find('span').append(reset)
})
</script>
<script type="text/javascript">
$('.right').click(function() {
var ele = $(this);
//通过.data方式设置数据
ele.data("a", "data test1")
ele.data("b", {
name: "data test2"
})
//通过.data方式取出数据
var reset = ele.data("a") + "</br>" + ele.data("b").name
ele.find('span').append(reset)
})
</script>
</body> </html>

同样的,jQuery也提供2个对应的删除接口,使用上与data方法其实是一致的,只不过是一个是增加一个是删除罢了

jQuery.removeData( element [, name ] )
.removeData( [name ] )

元素的数据存储-jQuery.data()与.data()的更多相关文章

  1. 数据存储-- Core Data的使用(二)

    一.基础概念深入 1.NSManagedObjectContext 被管理数据上下文就像便笺簿 当从数据持久层获取数据时,相当于把这些临时的数据拷贝写在便笺簿上,然后就可以随心所欲的修改这些值. 通过 ...

  2. 数据存储-- Core Data的使用(一)

    一.概念 1.Core Data 是数据持久化存储的最佳方式 2.数据最终的存储类型可以是:SQLite数据库,XML,二进制,内存里,或自定义数据类型 在Mac OS X 10.5Leopard及以 ...

  3. centos 7.1系统更改Mariadb数据存储位置步骤分享

    一.首先确保你要更改Mariadb数据存储的位置的空间够大 现在已将Mariadb存储位置更改到/opt/目录下 1.然后将Mariadb服务stop:systemctl stop mariadb 2 ...

  4. Ubuntu 安装mysql & 自定义数据存储目录

    一.安装 apt-get install mysql-server 执行过程如下: root@duke:~# apt-get install mysql-server 正在读取软件包列表... 完成 ...

  5. HTML5数据存储方案data与jQuery数据存储方案$.data()的区别

    我们先看下$.fn.data()的使用,这个和$.data()是不一样的,前者是和某个jquery对象相关,后者则是全局方法.主要有data()和removeData()这2个实例方法.通过下面的例子 ...

  6. 数据存储常用5种方式plist、Preference、NSCoding、SQLite3、Core Data

    数据存储 iOS应用数据存储的常用方式 XML属性列表(plist)归档 Preference(偏好设置) NSKeyedArchiver归档(NSCoding) SQLite3 Core Data ...

  7. iphone数据存储之-- Core Data的使用(一)

    http://www.cnblogs.com/xiaodao/archive/2012/10/08/2715477.html 一.概念 1.Core Data 是数据持久化存储的最佳方式 2.数据最终 ...

  8. (转)iphone数据存储之-- Core Data的使用

    原文:http://www.cnblogs.com/xiaodao/archive/2012/10/08/2715477.html iphone数据存储之-- Core Data的使用(一)   一. ...

  9. iphone数据存储之-- Core Data的使用

    一.概念 1.Core Data 是数据持久化存储的最佳方式 2.数据最终的存储类型可以是:SQLite数据库,XML,二进制,内存里,或自定义数据类型 在Mac OS X 10.5Leopard及以 ...

随机推荐

  1. CentOS7.5更改grub2菜单背景&开机动态画面

    Grub2菜单背景 红帽企业版 Linux 7 的引导装载程序是“GRUB 2”.您可以更改“GRUB 2”外观的几个部分.以下几小节将向您展示如何改变 Linux 发行版名称.菜单颜色,和背景图片. ...

  2. 洛谷P1565牛宫

    传送门:题目点这里; 首先理解题目,就是要求给定矩阵中权值和不小于零的最大子矩阵,数据范围200也还不算棘手,暴力n^4的算法也可以水到50分.正解要用到单调栈配合二分和前缀和,复杂度n^3logn, ...

  3. java Integer parseInt()

    先来一段代码,代码很简单的,如下: public static void main(String[] args) { Integer a = Integer.parseInt("3" ...

  4. linux shell date 用当天时间做备份文件名

    #!/bin/bash #date  显示时间,我们可以用时间的不同做为备份文件的名字,这样以前的备份就不会被覆盖 datename=$(date +%Y%m%d-%H%M%S)           ...

  5. WHERE 子句中的标量子查询

    标量子查询不仅可以用在SELECT 语句的列表中,它还可以用在WHERE 子句中,而且实际应用中子查询很多的时候都是用在WHERE子句中的. 先来看一个简单的例子,我们要检索喜欢“Story”的读者主 ...

  6. coreseek 段错误 (core dumped) 问题

    coreseek建立索引出现上面问题经过测试发现有下面几个原因: 1. 分词配置文件不存在  uni.lib 2. uni.lib配置文件格式不正确

  7. javascrip异步问题

    for ( var i = 1; i <= 3; i++) { setTimeout( function (){ console.log(i); }, 0); };     一般人会以为输出结果 ...

  8. Binary Tree Longest Consecutive Sequence -- LeetCode

    Given a binary tree, find the length of the longest consecutive sequence path. The path refers to an ...

  9. BZOJ 2242 [SDOI2011]计算器(快速幂+Exgcd+BSGS)

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=2242 [题目大意] 给出T和K 对于K=1,计算 Y^Z Mod P 的值 对于K=2 ...

  10. 【概率dp】【数学期望】Gym - 101190F - Foreign Postcards

    http://blog.csdn.net/DorMOUSENone/article/details/73699630