位置: 编程技术 - 正文

深入学习jQuery中的data()(jquery从入门到精通)

编辑:rootadmin

推荐整理分享深入学习jQuery中的data()(jquery从入门到精通),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:jquery基础教程,learning jquery,jquery从入门到精通,jquery基础教程详解,learning jquery,jquery基础教程详解,jquery教程csdn,jquery教程csdn,内容如对您有帮助,希望把文章链接给更多的朋友!

data有什么作用?

在我们平时js编码过程中,我们经常会向DOM元素中添加各种自定义属性,这样有一个弊端。

  1、假设我们在DOM元素中添加了一个属性,这个属性指向了某个js对象。 dom1.ele = jsObj

  2、当这个js对象发挥完作用后,我们已经用不到他了。这时候按理说应该把这个js变量清空,释放内存。大家都知道,如果一个js对象不存在任何外在引用的话,解释器会自动将其在内存中删除,这也是javascript相对于c++等手动管理内存的程序的优点。

  3、但是这时候问题来了,因为DOM元素引用了这个js对象,尽管这个js对象已经没有存在的意义了,但是解释器是不会把他删除的。如果想要把其删除,我们可能需要将DOM元素的这个属性设置为null。

  4、我们编写了这么多的代码,哪里能把 每个js对象是不是被DOM元素引用了都记住啊?

  5、而且,假如DOM元素与js对象之间相互循环引用,根本就无法删除! 这就是内存泄漏

  6、所以,为了避免这种情况的发生,我们要尽量避免 引用数据(这里的引用数据可以说是javascript对象) 直接依附在DOM对象上。

  7、data就是用来搞定以上问题的方法。

data是如何搞定以上问题的?

首先来说一说jQuery中Data实现的大体思路:

  1、首先我们创建一个数据缓存池,这个缓存池专门用来存储 向 DOM对象或者jQuery对象附加的额外数据。

  2、当我们要向DOM对象或者jQuery对象附加额外数据的时候,我们附加的数据其实是保存于这个缓存池中

  3、DOM对象或者jQuery对象生成一个额外属性,这个属性保存了 附加数据在缓存池中的‘门牌号'(位置或者索引)

  4、当我们访问DOM对象或者jQuery对象的附加数据时,实际上是先取得其附加数据的门牌号,然后找到缓存池中对应门牌号的数据,进行操作。

大体思路讲完,那么来分析一下具体思路:

在jQuery中,有一个Data构造函数,每当运行这个构造函数时,就会生成一个实例。

jQuery默认会自动生成两个Data实例:

深入学习jQuery中的data()(jquery从入门到精通)

  var dataPriv = new Data() jQuery私有的,我们尽量不要对这个实例进行操作。

  var dataUser = new Data() 这个就是服务于用户了,我们使用data()方法都是对这个实例进行操作。

所有的Data实例都有以下属性:

  expando: 值为字符串类型,每个Data实例的expando属性的值都不相同,用来区分不同的Data实例,类似于id的作用,expando的值就是上文中的额外属性。

  uid: 这就是上文中的门牌号,初始为1,随着不同对象的附加数据的加入,自增长。

  cache : 一个对象 {} ,这就是缓存池了。

来个实例:

body对象有一个名为jquer......的额外属性,

  这个属性的名称就是dataUser的expando的值

  这个属性的值就是门牌号。

总结: data实际上就是对js对象或者DOM对象的额外属性做了一个集中的管理。对于那些不会产生内存泄漏的额外数据,我们也可以直接向js对象或者DOM对象附加。

好,理清楚上面的关系后,我们再来看一下源码:

可能会有同学问道:如果我想对dataPriv进行操作该如何?

请看源码:

通过源码,我们可以看出:

jQuery.data() jQuery.remove()都是对dataUser进行操作,而jQuery._data() jQuery._remove()都是对dataPriv进行操作。

理解jQuery.data(ele,name,data) 与 jQuery().data(key,value)的不同。

  通过上面的源码,我们可以看到jQuery.data(ele,name,data)是对ele元素附加数据。

  而jQuery().data(key,value)则会为jQuery对象中的所有DOM对象分别附加数据

来看源码(删减了部分):

上文中的所有源码:为jQuery.1.

总结

标签: jquery从入门到精通

本文链接地址:https://www.jiuchutong.com/biancheng/373967.html 转载请保留说明!

上一篇:解决拦截器对ajax请求的拦截实例详解(拦截器 aop)

下一篇:jQuery插件DataTable使用方法详解(.Net平台)(jQuery插件能输出到控制台)

  • 怎么进行增值税纳税申报
  • 新建厂房装修费是否计入固定资产
  • 配件和修理费能一起用吗
  • 个人写的收据要留身份证复印件吗
  • 外勤会计主要是干什么
  • 个人所得税累计收入
  • 一般纳税人拿到小规模的专票
  • 贷款受托支付可以给股东吗
  • 非税收入包括哪些项目行政事业性收费
  • 借别人钱收据怎么写
  • 企业所得税业务费扣除标准
  • 个税速算扣除数是怎么计算出来的
  • 存货营业外支出包括哪些
  • 房屋出租要交产证吗
  • 在建工程的利息支出
  • 专票抵扣是税额吗
  • 税控信息表
  • 维修费用的税率
  • 违约金的涉税处理
  • 可抵扣进项税怎么抵扣
  • 售后返租税收规定
  • 企业的业务招待费多了好还是少了好
  • 企业白条报销和采取措施
  • 增值税小规模纳税人减免增值税
  • 小规模纳税人月销售额不超过10万免征
  • 零售金银首饰消费税税率是多少
  • 应交所得税和所得税费用的区别计算公式
  • win10无法运行软件怎么回事
  • 公司股东转账进公司账户,会计分录
  • 付款结算单范本
  • 美国华盛顿山在哪里
  • Vue3 中 createWebHistory 和 createWebHashHistory 的区别
  • php处理xml数据
  • 各浏览器主页的网址
  • 前端schema
  • 完美怎么用
  • 所得税申报表上的营业成本怎么填
  • 收缴违约金
  • python中类的属性
  • 织梦添加文章如何修改高级参数
  • 个人股东借款给公司涉及个税么
  • windows 和 linux
  • 无形资产减值准备可以转回吗
  • 清算的基本流程
  • 单位买车和个人买车交税有何不同
  • 小企业会计准则跨年红冲
  • 服务业 费用可以暂估吗?
  • 建筑行业工程施工当月可以不结转吗
  • 营改增后增值税税率的调整
  • 事业单位利息收入
  • 收到股本金 怎么记账
  • 社保调低,上半年多缴的怎么办
  • 银行信用贷款发放邮件后多久到账
  • 普通发票作废影响额度吗
  • 现金日记账需要日清月结吗
  • 代开的专票作废了怎么做账?
  • 明细账示例图
  • 公司变更地址后需要做哪些事情
  • 如何编写wa
  • 房产开发企业以什么为主
  • 建账内容
  • win7系统如何重新分区
  • 如何关闭windows防火墙
  • win10一年更新一次
  • Win7系统如何清除流氓屏保
  • linux开机流程详解
  • win7如何安装iis7.0
  • tomcat怎么启动
  • JavaScript正则表达
  • 批处理系统的进程调度算法
  • python中中文字符
  • js原型使用场景
  • 如何开发一个新的向量库
  • 湖北税务投诉电话
  • 教育培训机构都交哪些税
  • 境外服务收入如何纳税
  • 运城取暖费网上怎么交
  • 提高税务管理水平,降低税务风险
  • 土地增值税分期清算条件?
  • 一般纳税人办理退税流程及手续
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设