Jquery 差异 .html("") 与 .empty()

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17543711/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 19:16:48  来源:igfitidea点击:

Jquery Difference .html("") vs .empty()

jqueryperformance

提问by Antguider

In Jquery what is the difference between

在Jquery中有什么区别

$('#divid').html("");

and

$('#divid').empty();

Are both doing the same operating internallyinside jQuery.js?

两者都在 jQuery.js内部执行相同的操作吗?

and which one is better to use.

以及哪个更好用。

采纳答案by Aldi Unanto

T think .empty()is faster. This is the jQuery source for .empty()

T认为.empty()更快。这是 jQuery 源代码.empty()

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; }

And This is the jQuery .html("")source :

这是 jQuery.html("")源代码:

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, "<></>");

    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; }

It's clear, you can choose your best.

很明显,你可以选择你最好的。

回答by Arun Bertil

I tried the following in JSperf and found out using $('#divid').empty(); is better

我在 JSperf 中尝试了以下操作,发现使用 $('#divid').empty(); 更好

enter image description here

在此处输入图片说明

回答by Denys Séguret

From the source codeof the htmlfunction, among many other things :

从函数的源代码html,除其他外:

        if ( elem ) {
            this.empty().append( value );
        }

So htmlcalls empty. Thus it's (marginally) faster to simply call empty. And of course it's more readable.

所以html调用empty。因此,简单地调用empty. 当然,它更具可读性。