empty: function() {
var elem,
i = 0; for ( ; (elem = this[i]) != null; i++ ) {
// Remove element nodes and prevent memory leaks
if ( elem.nodeType === 1 ) {
//循环清除Data数据
jQuery.cleanData( getAll( elem, false ) );
} // 移除child
while ( elem.firstChild ) {
elem.removeChild( elem.firstChild );
} // If this is a select, ensure that it displays empty (#12336)
// Support: IE<9
if ( elem.options && jQuery.nodeName( elem, "select" ) ) {
elem.options.length = 0;
}
} return this;
},

代码中,首先清除了所有的data数据,那么data都包含哪些内容呢?

getALl方法查找到到所有后代元素。jquery的getAll代码如下:

var strundefined = typeof undefined;
function getAll( context, tag ) {
var elems, elem,
i = 0,
found = typeof context.getElementsByTagName !== strundefined ? context.getElementsByTagName( tag || "*" ) :
typeof context.querySelectorAll !== strundefined ? context.querySelectorAll( tag || "*" ) :
undefined; if ( !found ) {
for ( found = [], elems = context.childNodes || context; (elem = elems[i]) != null; i++ ) {
if ( !tag || jQuery.nodeName( elem, tag ) ) {
found.push( elem );
} else {
jQuery.merge( found, getAll( elem, tag ) );
}
}
} return tag === undefined || tag && jQuery.nodeName( context, tag ) ?
jQuery.merge( [ context ], found ) :
found;
} getAll(document.body,false);// HTMLCollection Array

将getALl取到的集合, cleanData

  1. removeEvent 解除事件,释放内存 (jquery绑定的事件保存在data中),代码如下,可以找到我们绑定的事件列表。//expando是页面中不重复的jquery每个对象的标识。expando: "jQuery" + ( version + Math.random() ).replace( /\D/g, "" ),

    $('body').on('click',function(){
    alert('this is body');
    });
    console.log($.cache[$('body')[0][$.expando]]);
  2. 删除internalKey(对象标识),push id到deletedIds

  

简单的说empty,首先循环给后代元素移除绑定、清除jquery给此dom的cache,然后循环removeFirstChild。

而html(''),则是简单暴力的设置innerHTML = '';

jQuery源码之 empty与html('')的区别的更多相关文章

  1. jQuery源码:从原理到实战

    jQuery源码:从原理到实战 jQuery选择器对象 $(".my-class"); document.querySelectorAll*".my-class" ...

  2. 读jQuery源码 - Callbacks

    代码的本质突出顺序.有序这一概念,尤其在javascript——毕竟javascript是单线程引擎. javascript拥有函数式编程的特性,而又因为javascript单线程引擎,我们的函数总是 ...

  3. jQuery源码-dom操作之jQuery.fn.html

    写在前面 前面陆陆续续写了jQuery源码的一些分析,尽可能地想要cover里面的源码细节,结果导致进度有些缓慢.jQuery的源码本来就比较晦涩,里面还有很多为了解决兼容问题很引入的神代码,如果不g ...

  4. 阅读jQuery源码的18个惊喜

    注释:本文使用$.fn.method指代调用一系列选中的元素的方法.例如,$.fn.addClass,指代$('div').addClass(‘blue’) 或 $('a.active’).addCl ...

  5. jQuery 源码解析二:jQuery.fn.extend=jQuery.extend 方法探究

    终于动笔开始 jQuery 源码解析第二篇,写文章还真是有难度,要把自已懂的表述清楚,要让别人听懂真的不是一见易事. 在 jQuery 源码解析一:jQuery 类库整体架构设计解析 一文,大致描述了 ...

  6. jQuery 源码解析一:jQuery 类库整体架构设计解析

    如果是做 web 的话,相信都要对 Dom 进行增删查改,那大家都或多或少接触到过 jQuery 类库,其最大特色就是强大的选择器,让开发者脱离原生 JS 一大堆 getElementById.get ...

  7. 读jQuery源码有感2

    那么就来读读jQuery源码的Callbacks部分. 一上来看原版源码 jQuery.Callbacks = function( options ) { // Convert options fro ...

  8. jQuery源码分析系列

    声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://git ...

  9. jQuery源码学习感想

    还记得去年(2015)九月份的时候,作为一个大四的学生去参加美团霸面,结果被美团技术总监教育了一番,那次问了我很多jQuery源码的知识点,以前虽然喜欢研究框架,但水平还不足够来研究jQuery源码, ...

随机推荐

  1. jq 在字符串中,去掉指定的元素

    例: var arr= ["4.5岁", "3.5岁", "5.5岁", "5岁", "4岁"] v ...

  2. EZ 2018 03 16 NOIP2018 模拟赛(四)

    链接:http://211.140.156.254:2333/contest/64 我去掉了一百多分! 这次的题目怎么说呢,特别水,但是就是出现了一些很逗的错误导致炸裂. 最好笑的是SB的不只我一个: ...

  3. libgdx学习记录9——FreeType,ttf中文显示

    前面讲到使用Hireo创建的BitmapFont以显示中文字体.这种方式效率很高,当所要显示的字的总数较少,并且大小比较固定时,可以采用这种方式. 但是这种也有弊端: (1)字体大小不能随意设置,当放 ...

  4. springboot项目生成jar包(带静态资源)方法

    [Maven]在pom.xml文件中使用resources插件的小作用 不过war包比较实用,毕竟独立的tomcat比较好控制

  5. Elasticsearch Query DSL 整理总结(一)—— Query DSL 概要,MatchAllQuery,全文查询简述

    目录 引言 概要 Query and filter context Match All Query 全文查询 Full text queries 小结 参考文档 引言 虽然之前做过 elasticse ...

  6. Jenkins+Maven+SVN+Nexus自动化部署代码实例

    本文接着上篇安装jenkins,安装相关插件,使用我们公司持续集成的测试环境实例进行演示 ========= 完美的分割线 ========== 1.安装jenkins的maven插件 如果要使用je ...

  7. muduo网络库学习笔记(五) 链接器Connector与监听器Acceptor

    目录 muduo网络库学习笔记(五) 链接器Connector与监听器Acceptor Connector 系统函数connect 处理非阻塞connect的步骤: Connetor时序图 Accep ...

  8. M1阶段事后总结

    设想和目标 1. 我们的软件要解决什么问题?是否定义得很清楚?是否对典型用户和典型场景有清晰的描述?我们组要爬取网上的内容供下一组使用,定义的不太清楚,因为用户只有下一个团队所以没有进行详细的需求分析 ...

  9. 实现文字左右滚动 javascript

    参考链接:http://www.86y.org/art_detail.aspx?id=587 代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 ...

  10. 四则运算安卓版ver.mk2

    做了一点微小的变动....非常微小...不过美观点了就是...那就是----加背景! 变更后的部分代码: <LinearLayout xmlns:android="http://sch ...