A-A+
jQuery中empty与html(”)的区别对比
在jquery中empty与html('')的区别许多的朋友估计不是非常的清除了，下文我们给各位empty与html('')的区别级例子，希望下文能够对各位有所帮助，具体如下。
html()
返回值:String
概述:
取得第一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档。
empty()
返回值:jQuery
概述:
删除匹配的元素集合中所有的子节点。
html() 方法如果未设置参数，则返回被选元素的当前内容。
html("") 则清空被选元素的当前内容。
empty() 方法从被选元素移除所有内容，包括所有文本和子节点。
例子:
- 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 <a href="/tags.php/select/" target="_blank">select</a>, 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 str<a href="/tags.php/undefined/" target="_blank">undefined</a> = 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,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]]);
删除internalKey（对象标识），push id到deletedIds,简单的说empty，首先循环给后代元素移除绑定、清除jquery给此dom的cache，然后循环removeFirstChild,而html('')，则是简单暴力的设置innerHTML = '';