繁星——jquery的data()方法
今天在看JQuery文档的时候偶然看到了data()方法,觉得挺好用的,这里做个记录。
这个方法用于在元素上存放数据,返回jQuery对象。在文档中提到V1.4.3 新增用法NEW data(obj) 可传入key-value形式的数据。这个方法的用法如下:
(1)在一个div上存取数据
//HTML代码:
<div></div> //JQuery代码:
$("div").data("blah"); // undefined
$("div").data("blah", "hello"); // blah设置为hello
$("div").data("blah"); // hello
$("div").data("blah", 86); // 设置为86
$("div").data("blah"); // 86
$("div").removeData("blah"); //移除blah
$("div").data("blah"); // undefined
(2)在div上存取键值对
//HTML代码:
<div></div> //JQuery代码:
$("div").data("test", { first: 16, last: "pizza!" });
$("div").data("test").first //16;
$("div").data("test").last //pizza!;
这个方法用来在前端存取数据看起来很方便,实际使用时还需注意以下问题:
(1)如果jQuery集合指向多个元素,那将在所有元素上设置对应数据。 这个函数不用建立一个新的expando,就能在一个元素上存放任何格式的数据,而不仅仅是字符串。
(2)当使用.data()获取值时,jQuery会首先尝试将获取的字符串值转化成JS类型,包括布尔值,null,数字,对象,数组:
若值是”true|false”,则返回相应的布尔值;
若值是”null”,则返回null;
若值是纯数字构成的字符串(+data + ”” === data),则返回相应的数字(+data);
若值是由(?:\{[\s\S]*\}|\[[\s\S]*\])$,比如”{key:value}“或[1,2,3],则尝试使用jQuery.parseJSON解析之;
否则返回字符串值。
那么,若想获取字符串值而不想获得自动转换的值,可以使用.attr(“data-”+key)来获取相应的值,代码示例如下:
1 var bieh = $(div).attr(“data-”+bieh)
繁星——jquery的data()方法的更多相关文章
- HTML 5 的自定义 data-* 属性和jquery的data()方法的使用
人们总喜欢往HTML标签上添加自定义属性来存储和操作数据.但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副 ...
- html5的自定义data-*属性和jquery的data()方法的使用示例
人们总喜欢往HTML标签上添加自定义属性来存储和操作数据. 但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它 ...
- html5的自定义data-*属性与jquery的data()方法的使用
人们总喜欢往HTML标签上添加自定义属性来存储和操作数据.但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副 ...
- html5的自定义data-*属性和jquery的data()方法的使用
人们总喜欢往HTML标签上添加自定义属性来存储和操作数据.但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副 ...
- jQuery 的.data()方法
jQuery文档对.data()方法的描述: As of jQuery 1.4.3 HTML 5 data- attributes will be automatically pulled in to ...
- 对 jQuery 中 data 方法的误解
一直以来都认为新版本中 data 是调用 dataset 实现的,对于低版本IE则采用 getAttribute其实一直是我误解了,也不知道最初这个想法是怎么来的.难道我被盗梦了? 今天 谢亮 兄弟和 ...
- jQuery的data()方法
jQuery文档对.data()方法的描述: As of jQuery 1.4.3 HTML 5 data- attributes will be automatically pulled in to ...
- jQuery中data()方法用法实例
语法结构一: 复制代码代码如下: $(selector).data(name,value) 参数列表: 参数 描述 name 存储的数据名称. value 将要存储的任意数据. 实例代码: 复制代码代 ...
- jQuery中使用data()方法读取HTML5自定义属性data-*实例
如果你使用jQuery类库,那么你可以非常愉悦的使用jquery的data()方法存取data-* 自定义属性,方法允许我们在DOM元素上绑定任意类型的数据,避免了循环引用的内存泄漏风险 主要的方法如 ...
随机推荐
- 文档对象模型(DOM)中的结点属性
在文档对象模型中,每个结点都是一个对象.DOM结点有三个重要的属性:nodeName .nodeValue和nodeType,分别表示结点名称.结点的值和结点的类型 一.nodeName,结点名称,只 ...
- 介绍一个可以将Expression表达式树解析成Transact-SQL的项目Expression2Sql
一.Expression2Sql介绍 Expression2Sql是一个可以将Expression表达式树解析成Transact-SQL的项目.简单易用,几分钟即可上手使用,因为博主在设计Expres ...
- Analyzer中进行货币转换
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
- MVC架构 使用FastReport
1.Web.config文件 添加配置 <httpHandlers> <add path="FastReport.Export.axd" verb="* ...
- Hello 2017!
- 微软亚洲实验室一篇超过人类识别率的论文:Delving Deep into Rectifiers: Surpassing Human-Level Performance on ImageNet Classification ImageNet Classification
在该文章的两大创新点:一个是PReLU,一个是权值初始化的方法.下面我们分别一一来看. PReLU(paramter ReLU) 所谓的PRelu,即在 ReLU激活函数的基础上加入了一个参数,看一个 ...
- Keil软件常见的警告和错误含义。——Arvin
1. warning: #767-D: conversion from pointer to smaller integer 解释:将指针转换为较小的整数 影响:可能造成的影响:容易引起数据截断,造 ...
- android 画虚线、实线,画圆角矩形,一半圆角
1.画虚线,实线: 建立dotted_line_gray.xml文件放在drawable文件夹下面. android:shape="line" 可以修改你想要的形状 <?xm ...
- 误删除libc.so.6 恢复
一.我是怎样一步一步毁掉系统的 最近在centos 7上进行开发.由于需要使用高版本linux内核的特性,需要将linux内核升级.按照教程:centos 7升级内核 进行升级的时候发现在安装elre ...
- python数据类型
整数 十六进制需要用前缀0x+0-9+a-f表示,如0xff00 浮点数(小数) 可以用1.23,1.56e9(科学计数法)表示 字符串 ""或''括起来都行 布尔值 只有True ...