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

时间:2022-09-01 00:20:04

(-1)说明

我用的是chrome49,这个方法涉及到JQuery版本问题,我手里有3.0的,有1.9.1,后面将1.9.1及其以前的称为低版本,3.0称为高版本

测试例子用到的showMessage方法如下

showMessage.i = 0;
function showMessage(object)
{
  var body = $("body")[0];
  var $p =$("#debugp");

  if($p.length==0)
  {
    $p = $("<p/>").attr("id","debugp");
    $(body).prepend($p);
  }
  $p[0].innerHTML += "<br/>"+(showAttribute.i++)+" | "+object;
}

  

(0)$.data(obj,key,value)

key值为字符串类型,为数字、对象(var lol={}),是没有意义的,value值可以为普通类型,当为引用类型时传递的是引用而不是克隆

a.

  var obj = {"name":"寒冰射手","age":"12"};
  $.data(obj,"height",165);
  showMessage($.data(obj,"height"));

  $.data实际将数据放在了对象属性上,类似于obj.sex="女",无论你通过$.data添加几个key给obj,在obj只会多出一个类似于jQuery300082932543555993442

  300082932543555993442是jQuery产生的随机数,它指向一个对象,对象里面通过key-value的形式存储着你添加的数据

  低版本可以通过for-in遍历出jQuery300082932543555993442,高版本只能通过debug工具查看了

b.

  当value是一个对象时,传递的是引用

  var husband = ["蛮族之王"];
  var obj = {"name":"寒冰射手","age":"12"};
  $.data(obj,"husband",husband);
  $.data(obj,husband)[0] = "遁地龙卷风";
  showMessage($.data(obj,husband));//输出   遁地龙卷风

(2)$(selector).data(key,value)

$("#lol").data("name","寒冰射手");

showMessage($("#lol").data("name"));

$(selector).data将数据绑定在HTML DOM元素上,剩下的特性与$.data方法一样,不过可以通过for-in得到添加的对象

JQuery data方法的使用-遁地龙卷风的更多相关文章

  1. html 5 data-&ast; &lpar;dataset&rpar; 属性和 jquery data方法比较

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

  2. JQuery simpleModal插件的使用-遁地龙卷风

    (0)写在前面 jquery.simpleModal.浏览器这三者的兼容性,不仅显示在报错上,还体现在所呈现的效果不是预期上. 说一下我的环境 jquery-1.8.3.js jquery.simpl ...

  3. 转载 JQuery&period;data&lpar;&rpar;方法学习

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

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

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

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

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

  6. jquery data方法

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

  7. JQuery插件Validation的使用-遁地龙卷风

    第二版 (-1)写在前面 本文不是要详细说明Validation插件的使用,而是将满足开发需求的代码已最应该使用的方式写出来,并附有详细的注释 想要了解更多,去jquery的官网,有最新,最全面的,后 ...

  8. jQuery 数据 - jQuery&period;data&lpar;&rpar; 方法

    打印出 hi

  9. HTML5 自定义属性 data-&ast; 和 jQuery&period;data 详解

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

随机推荐

  1. 【Pyrosim案例】01:空气流动

    1 案例说明 Pyrosim是一款FDS前后处理软件.以一个非常简单的案例来描述Pyrosim的工作流程.本案例计算域中包含一个空气入口,一个环境出口. 案例主要演示以下内容: 创建Vents 增加切 ...

  2. NOI 题库 8465

    8465  马走日 描述 马在中国象棋以日字形规则移动. 请编写一段程序,给定n*m大小的棋盘,以及马的初始位置(x,y),要求不能重复经过棋盘上的同一个点,计算马可以有多少途径遍历棋盘上的所有点. ...

  3. python 代码片段19

    #coding=utf-8 # 函数 def foo(x): print x foo(123) # import httplib def check_web_server(host,port,path ...

  4. 2015年第12本(英文第8本):the Old Man and the Sea 老人与海

    书名:The Old Man and The Sea(老人与海) 作者:Ernest Hemingway 单词数:2.7万 不重复单词数:2600 首万词不重复单词数:1500 蓝思值:940 阅读时 ...

  5. f2fs解析(八)node 管理器中的node&lowbar;info

    free_info 功成身退,node_info顺利接班. // 这里还是蛮复杂的一件事,如果不搞清除的话,这个历史性的接班工作我们就接不上 上面说到 alloc_nid 和 alloc_nid_do ...

  6. CSS3&plus;HTML5学习笔记(1)

    box内阴影: -moz-box-shadow:inset 30px #; -webkit-box-shadow:inset 30px #; box-shadow:inset 30px #; 多重文字 ...

  7. cocos2d-x Android环境搭建

    1.Java虚拟机.分32位和64位.64位: jdk-8u11-windows-x64-8.0.11.12.1406275777 环境变量配置,我的电脑右击->属性->高级系统设置-&g ...

  8. Codeforces 429 A&period; Xor-tree

    下来的第一次相遇是在不翻盖的同一节点,递归可以是.... A. Xor-tree time limit per test 1 second memory limit per test 256 mega ...

  9. &lpar;NO&period;00001&rpar;iOS游戏SpeedBoy Lite成形记&lpar;七&rpar;

    因为我们之前在GameScene中建立的2个数组,分别为player和label的数组.大家可以注意到其中每个元素是一一对应的. 知道了这层关系,我们尝试来更新matchRun方法: CCAction ...

  10. 杨校老师课堂之JavaScript右下角广告弹框教程

    案例制作思路: 1.先制作界面 添加一个盒子包含一个按钮,使盒子绝对定位在右上角 添加一个大盒子,同理,将盒子居于左下角:其中内部包含一个顶端盒子和底部盒子 顶端盒子因为是属于大盒子内部的存在,所以宽 ...