【jquery之data()】的更多相关文章

HTML 5 的自定义 data-* 属性和jquery的data()方法的使用

人们总喜欢往HTML标签上添加自定义属性来存储和操作数据.但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副作用.这就是为什么在HTML5规范里增加了一个自定义data属性,你可以拿它做很多有用的事情. 你可以去读一下HTML5的详细规范,但这个自定义data属性的用法非常的简单,就是你可以往HTML标签上添加任意以 "data-"开头的属性,这些属性页面上是不显示的,它不会影响到你的页面布局和…

jQuery 中 data 方法的实现原理

前言:jQuery 作为前端使用最多最广泛的 JS 库,其源码每个 JSer 都应该研究一下.早就打算看却一直被各种事拖着,上次某公司面试时被问到 jQuery 中 data 方法是如何实现的,结果答不上来懊悔不已.现在终于下决心开始看 jQuery 的源码,就从 data 方法开始.本人也是前端新手,如果文章中有理解不当或者错误之处,欢迎留言指出,3Q~ jQuery 版本为 1.8.2 data() 的使用方法 // 向一个 dom 元素绑定数据 $("#header").data…

html5的自定义data-＊属性和jquery的data()方法的使用示例

人们总喜欢往HTML标签上添加自定义属性来存储和操作数据. 但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副作用. 这就是为什么在HTML5规范里增加了一个自定义data属性,你可以拿它做很多有用的事情. 你可以去读一下HTML5的详细规范,但这个自定义data属性的用法非常的简单,就是你可以往HTML标签上添加任意以 "data-"开头的属性,这些属性页面上是不显示的,它不会影响到你的页面布…

jQuery 的.data()方法

jQuery文档对.data()方法的描述: As of jQuery 1.4.3 HTML 5 data- attributes will be automatically pulled in to jQuery's data object. The treatment of attributes with embedded dashes was changed in jQuery 1.6 to conform to the W3C HTML5 specification. 示例: <div…

html5的自定义data-*属性与jquery的data()方法的使用

人们总喜欢往HTML标签上添加自定义属性来存储和操作数据.但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副作用.这就是为什么在HTML5规范里增加了一个自定义data属性,你可以拿它做很多有用的事情. 你可以去读一下HTML5的详细规范,但这个自定义data属性的用法非常的简单,就是你可以往HTML标签上添加任意以 "data-"开头的属性,这些属性页面上是不显示的,它不会影响到你的页面布局和…

html5的自定义data-*属性和jquery的data()方法的使用

人们总喜欢往HTML标签上添加自定义属性来存储和操作数据.但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副作用.这就是为什么在HTML5规范里增加了一个自定义data属性,你可以拿它做很多有用的事情. 你可以去读一下HTML5的详细规范,但这个自定义data属性的用法非常的简单,就是你可以往HTML标签上添加任意以 "data-"开头的属性,这些属性页面上是不显示的,它不会影响到你的页面布局和…

Jquery下控制backgroundPosition位置的问题/jquery查找data id相等的元素

1:想通过控制backgroundPosition 来实现动态效果: $(this).animate({"background-positionY":-13},1); //但是火狐不兼容 $(this).css('background-position','0px 0px'); //完全兼容 2:jquery查找data id相等的元素 $(" li [ data-id = ' + region_id + ' ]")…

jquery中data()和js中dataset属性的区别

INTRO html的标签属性data-允许用户自定义属性.原生javascript和jquery分别定义了dataset属性和data()方法对标签中的data属性进行操作. 取值: 如我们定义这样两个标签: <h1 data-attrname="balabala"></h1> <h2 data-attrname="[1,2,3,4]"></h2> javascript的访问方式是dataset.attrname.我…

jQuery.data() 与 jQuery(elem).data()源码解读

之前一直以为 jQuery(elem).data()是在内部调用了 jQuery.data(),看了代码后发现不是.但是这两个还是需要放在一起看,因为它们内部都使用了jQuery的数据缓存机制.好吧,重点就是data_user对象,跟另一个data_priv是姐妹~~ 先来看下jQuery.data(): 它调用了data_user.access( elem, name, data ); 那么data_user到底是什么鬼呢?? 我们看到,它是由Data构造的实例,Data构造器都做了一些什么呢…

jQuery的data()方法

jQuery文档对.data()方法的描述: As of jQuery 1.4.3 HTML 5 data- attributes will be automatically pulled in to jQuery's data object. The treatment of attributes with embedded dashes was changed in jQuery 1.6 to conform to the W3C HTML5 specification. 示例: $("di…

繁星——jquery的data()方法

今天在看JQuery文档的时候偶然看到了data()方法,觉得挺好用的,这里做个记录. 这个方法用于在元素上存放数据,返回jQuery对象.在文档中提到V1.4.3 新增用法NEW data(obj) 可传入key-value形式的数据.这个方法的用法如下: (1)在一个div上存取数据 //HTML代码: <div></div> //JQuery代码: $("div").data("blah"); // undefined $("…

jQuery中data()方法用法实例

语法结构一: 复制代码代码如下: $(selector).data(name,value) 参数列表: 参数 描述 name 存储的数据名称. value 将要存储的任意数据. 实例代码: 复制代码代码如下: <!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.jb51.net…

jquery send(data) 对data的处理

// Convert data if not already a string if ( s.data && s.processData && typeof s.data !== "string" ) { s.data = jQuery.param( s.data, s.traditional ); }…

Jquery　Data Table插件

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=ed…

-_-#【jQuery】data

.data() <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body data-last-value="43" data-options='{"name": "John"}'> <script src="h…

关于JQuery中$.data绑定数据原理或逻辑

问题: JQuery中,对于.data([key],[value])函数,当使用其进行数据绑定时,假设要绑定的数据是“引用数据类型”,也就是对象:那么.data函数绑定的是该对象的副本还是该对象的一个引用?下面通过以下小例子来测试下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Test</title>…

jquery的data、attr、expando

今天无意中遇到 data和 attr的问题 场景是这样 需要给一个标签赋值,data-skin 同事用data赋值 $("#div").data("skin",2131); //  标签上并没有出现 data-href的属性 $("#div").attr("data-skin",2131); // 如果用attr就是 ok的 花了时间弄了下他们的区别 data赋值是存在$.cache中,不是在标签中 attr是通过绑定在标签中…

jquery之data()

$("#test").data("myProp","123") alert($("#test").data("myProp"))   结果123 jquery里面的data()用来缓存内存中的原生dom对象的某个属性 $("#test").data("myProp","123") 虽然赋值了,但是也没看不到 alert($("#test&…

对 jQuery 中 data 方法的误解

一直以来都认为新版本中 data 是调用 dataset 实现的,对于低版本IE则采用 getAttribute其实一直是我误解了,也不知道最初这个想法是怎么来的.难道我被盗梦了? 今天 谢亮 兄弟和我讨论一个东西的时候,谈到了性能,他用的是 attr 操作自定义属性 data-uid,我说用 data 好,因为是 dataset 实现,然后他去翻了下 jQuery 源码和我说,没有发现这个东西,我就纳闷了.于是我去仔细读了下 data 方法的源码,才发现我一直误会了,再此,向之前问我 data…

模仿jquery的data

jquery中,有这个方法 var obj = {}; $.data(obj,'name','jake'); console.info($.data(obj,'name')); console.info(obj); 输出结果 由此可知,$.data(),里面有三个参数时,是赋值的,里面有两个参数时是取值,一贯的jquery作风. 这里模仿一下 var $data = (function(){ var expando = 'jQuery'+String(Math.random()).replace…

jQuery Mobile Data 属性

按钮 带有 data-role="button" 的超链接.button 元素.工具栏中的链接以及 input 字段都会自动渲染成按钮样式,不需要添加 data-role="button". Data-属性 值 描述 data-corners true | false 规定按钮是否圆角 data-icon Icons 参考手册 规定按钮的图表.默认没有图标. data-iconpos left | right | top | bottom | notext 规定图标…

jQuery的data() 和 h5 的 dataset()

作用:获取自定义属性 命名规则:驼峰命名法  data-user==>user data-user-name==>userName 区别:jQuery:操作内存   h5: 操作DOM jQuery修改自定义属性后,在DOM看不到改变,而h5可以 用法: 使用场景:Tab切换(通过自定义属性与内容相关联,内容可以打乱顺序) <body> <ul class="nav"> <!--在渲染的时候 大小的属性会转换成小写 --> <li…

视图中 jquery 使用data属性

示例:<input id='username' data-id="{$val['id']}" data-userName="{$val['name']}" type="checkbox" value="{$val['id']}" name="name" /> 在js中,必须使用小写. var name = $('#username').data("userName");//u…

jQuery数据缓存方案详解：$.data()的使用

我们经常使用隐藏控件或者是js全局变量来临时存储数据,全局变量容易导致命名污染,隐藏控件导致经常读写dom浪费性能.jQuery提供了自己的数据缓存方案,能够达到和隐藏控件.全局变量相同的效果,但是jQuery实现方式更优雅.为了更好地使用jQuery数据缓存方案,我们需要掌握$.data().$.cache.$.expando.$.hasData().$.removeData(). $.hasData()用来判断某个对象是否有附加的属性,可以给任何JavaScript对象和HTMLElemen…

jQuery data

大家会如何设计一个缓存呢? 一个简单的Cache (function(){ var __cache = {}, Cache = { get: function(__name){ return __cache[__name] || undefined; }, set: function(__name, __value){ return (__cache[__name] = __value) } }; this.Cache = Cache; })(); alert(Cache.get("name&q…

jQuery 3.0 的 Data 浅析

jQuery 3.0 在6月9日正式发布了,3.0 也被称为下一代的 jQuery .这个版本从14年10月开始,其中发布过一次beta 版(2016/1/14,)和候选版(2016/05/20).一路走来,颇为不易. 文章目录 Data浅析 Data在jQuery内部的使用 1.x.x 和 2.x.x 的比较 一.Data浅析 jQuery 3.0 中的 Data 是内部使用的,定义为一个“类”.一共用它创建了两个对象,dataPriv 和 dataUser.Data 有 1 个对象属性(ex…

深入jQuery中的data()

引入 data函数在jQuery中看起来很不起眼, 就像沙滩上一颗平凡的沙子, 但仔细一瞅, 却惊讶的发现data是jQuery中无比重要的一环, 甚至jQuery中各种事件都基于此. data有什么作用? 在我们平时js编码过程中,我们经常会向DOM元素中添加各种自定义属性,这样有一个弊端. 1  假设我们在DOM元素中添加了一个属性,这个属性指向了某个js对象. dom1.ele = jsObj 2  当这个js对象发挥完作用后,我们已经用不到他了.这时候按理说应该把这个js变量清空,释放内…

jQuery源码解读 - 数据缓存系统：jQuery.data

jQuery在1.2后引入jQuery.data(数据缓存系统),主要的作用是让一组自定义的数据可以DOM元素相关联——浅显的说:就是让一个对象和一组数据一对一的关联. 一组和Element相关的数据如何关联着这个Element一直是web前端的大姨妈,而最初的jQuery事件系统照搬Dean Edwards的addEvent.js:将回调挂载在EventTarget上,这样下来,循环引用是不可忽视的问题.而在web前端中,数据和DOM的关系太过基情和紧张,于是jQuery在1.2中,正式缔造了…

jQuery的XX如何实现？——3.data与cache机制

往期回顾: jQuery的XX如何实现?——1.框架 jQuery的XX如何实现?——2.show与链式调用 -------------------------- 源码链接:内附实例代码 jQuery使用许久了,但是有一些API的实现实在想不通.于是抽空看了jQuery源码,现在把学习过程中发现的一些彩蛋介绍给大家(⊙0⊙). 下面将使用简化的代码来介绍,主要关注jQuery的实现思想~>_<~ 相较于第一篇(与第二篇无相关性),代码更新了:27~71 (function(window, un…

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

新的HTML5标准允许你在普通的元素标签里,嵌入类似data-*的属性,来实现一些简单数据的存取.它的数量不受限制,并且也能由javascript动态修改,也支持CSS选择器进行样式设置.这使得data属性特别灵活,也非常强大.有了这样的属性我们能够更加有序直观的进行数据预设或存储.下面介绍HTML5 Dataset 存储的实际应用,以及包括jQuery在内的四种存取方式. HTML5 Dataset 存储的例子 为一个元素分配data属性存储数据,例如这是一个span元素,它的内容是一首音乐的…