zoukankan      html  css  js  c++  java
  • js 的 $.data() 和 $('div').data() 缓存机制

    这两种方式是有区别的,写个小例子

    ...
    <div id="people">
    </div>
    ...
    
    // 注意这里是两个不同的对象   lucy === lily  false
    var lucy = $("#people");
    var lily = $("#people");
    
    // 分别设置age
    lucy.data('age',12);
    lily.data('age',13);
    
    lucy.data('age'); // 13(注意)
    lily.data('age'); // 13
    
    

    为什么导致这样的情况呢?
    大家再看一个例子

    // 注意这里是两个不同的对象   lucy === lily  false
    var lucy = $("#people");
    var lily = $("#people");
    
    $.data(lucy,'age',12);
    $.data(lily,'age',13);
    
    $.data(lucy,'age'); // 12(注意)
    $.data(lily,'age'); // 13
    
    

    大家看到了吧,这个地方获取出来的 lucy age为12 和上面是有区别的,为什么呢?
    对于jquery中的封装,两个是有区别的。
    简单的来讲:(注意这是高能预警)

    lucy.data() 是针对dom对象的。
    $.data(lucy) 是针对jquery对象的。
    

    实际上对于这两者而言,其内部实现方法都是一样的,只不过lucy.data() 在调用底层cache方法的时候,将进行了this[0]处理。
    如果要使用$.data来获取 某个元素的值的话,也是可以的,使用 $.data(lucy[0])
    再给大家补充一点:
    如果lucy是一个li标签,那么$("li").data('hello','world') 这个时候,等于给所有的li标签添加了一个缓存值,名字叫做hello,对应的value 为world。
    这个时候再使用$.data(lucy[0]) 来获取属性的时候,实际上是获取整个dom元素中的,第一个li标签的hello的值world

    实际上整个cache过程,主要是Data实例对象的cache

  • 相关阅读:
    OAuth2.0 基础概述
    Ubuntu安装Gogs服务
    ASP.NET WebAPI 生成帮助文档与使用Swagger服务测试
    ASP.NET MVC 中的路由
    升级Ghost
    搭建Golang开发环境
    TDD并不是看上去的那么美
    .NET Framework 源码查看与调试
    在 ASP.NET MVC 中使用异步控制器
    SpringMVC+FreeMarker+Mybatis 整合
  • 原文地址:https://www.cnblogs.com/osinger/p/6015271.html
Copyright © 2011-2022 走看看