jQuery.fn.empty()和jQuery.fn.html('')有什么区别? [英] What's the difference between jQuery.fn.empty() and jQuery.fn.html('')?
问题描述
两者之间是否有任何区别
Is there any difference between
$("#header").empty()
和
$("#header").html('')
?
我还应该使用哪个? $("#header").empty()
更具可读性,但有什么东西会比$("#header").html('')
更快?
Also, which should I use? $("#header").empty()
is more readable, but how could anything be faster than $("#header").html('')
?
推荐答案
两者之间没有功能上的区别.使用.empty()
,因为它更短(更简洁)并且更易读.
There is no functional difference between the two. Use .empty()
since it is shorter (more terse) and more readable.
不用担心性能差异.请记住,没有使用jQuery是因为它的运行时间比原始JavaScript快.之所以使用它,是因为它更快地编写.开发人员时间所花的时间远远超过处理器时间.
Don't worry about the performance difference. Remember, jQuery isn't used because it runs faster than vanilla JavaScript — it's used because it's written faster. Developer time is worth far more than processor time.
已经有一个jsPerf可以比较相对性能: http://jsperf.com/jquery- empty-vs-html . 每个测试案例都显示.empty()
更快.
There's already a jsPerf to compare the relative performance: http://jsperf.com/jquery-empty-vs-html. Every single test case shows that .empty()
is faster.
直接来自jQuery来源:
Straight from the jQuery source:
empty: function() {
for ( var i = 0, elem; (elem = this[i]) != null; i++ ) {
// Remove element nodes and prevent memory leaks
if ( elem.nodeType === 1 ) {
jQuery.cleanData( elem.getElementsByTagName("*") );
}
// Remove any remaining nodes
while ( elem.firstChild ) {
elem.removeChild( elem.firstChild );
}
}
return this;
},
html: function( value ) {
if ( value === undefined ) {
return this[0] && this[0].nodeType === 1 ?
this[0].innerHTML.replace(rinlinejQuery, "") :
null;
// See if we can take a shortcut and just use innerHTML
} else if ( typeof value === "string" && !rnocache.test( value ) &&
(jQuery.support.leadingWhitespace || !rleadingWhitespace.test( value )) &&
!wrapMap[ (rtagName.exec( value ) || ["", ""])[1].toLowerCase() ] ) {
value = value.replace(rxhtmlTag, "<$1></$2>");
try {
for ( var i = 0, l = this.length; i < l; i++ ) {
// Remove element nodes and prevent memory leaks
if ( this[i].nodeType === 1 ) {
jQuery.cleanData( this[i].getElementsByTagName("*") );
this[i].innerHTML = value;
}
}
// If using innerHTML throws an exception, use the fallback method
} catch(e) {
this.empty().append( value );
}
} else if ( jQuery.isFunction( value ) ) {
this.each(function(i){
var self = jQuery( this );
self.html( value.call(this, i, self.html()) );
});
} else {
this.empty().append( value );
}
return this;
},
.empty()
不必检查各种可能的参数类型;可以直接删除DOM元素.
.empty()
doesn't have to deal with checking the different possible argument types; it can get right down to chucking out DOM elements.
这篇关于jQuery.fn.empty()和jQuery.fn.html('')有什么区别?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!