这两种上传方法有什么不同的方法和哪个更好

Question

当我偶然发现loadCSS时，我只是写了一个onload函数。它的onloadcss函数以不同的方式工作。

我的功能

var onLoadElement = function(element, callback) {

    if (element.addEventListener) {
        element.addEventListener("load", callback, 0);
    } else if (element.readyState) {
        element.onreadystatechange = callback;
    } else {
        element.onload = callback;
    }
}

loadcss的功能

function onloadCSS( ss, callback ) {
    ss.onload = function() {
        ss.onload = null;
        if( callback ) {
            callback.call( ss );
        }
    };
    // No support for onload:
    // Weak inference targets Android < 4.4
    if( "isApplicationInstalled" in navigator && "onloadcssdefined" in ss ) {
        ss.onloadcssdefined( callback );
    }
}

显然它已添加了android支持，但我不清楚为什么不使用ss.onload= callback而不是以下代码段。

 ss.onload = null;
 if( callback ) {
     callback.call( ss );
 }

我试图调整我的功能以包含对.onload的不支持，但我想知道是否要进一步修改它。

var onLoadElement = function(element, callback) {

    if (element.addEventListener) {
        element.addEventListener("load", callback, false);
    } else if (element.readyState) {
        element.onreadystatechange = callback;
    } else if(element.onload){
        element.onload = callback;
    } else if( "isApplicationInstalled" in navigator && "onloadcssdefined" in element ) {
        element.onloadcssdefined( callback );
    }
}

更新

感谢Mike-C为你的answer，我现在明白它的loadCSS方法可以节省内存。

所以理论上这可以减少内存使用量并获得更好的浏览器支持？

var onLoadElement = function(element, callback) {

    if(typeof callback !== 'function') return;

    if (element.addEventListener) {
        var cb = function(){
            callback.call( element );
            element.removeEventListener("load", cb)
        }
        element.addEventListener("load", cb, false);
    } else if (element.readyState) {
        element.onreadystatechange = function(){
            element.onreadystatechange = null;
            callback.call( element );
        }
    } else if(element.onload){
        element.onload = function(){
            element.onload = null;
            callback.call( element );
        }
    } else if( "isApplicationInstalled" in navigator && "onloadcssdefined" in element ) {
        element.onloadcssdefined( callback );
    }
}

好主意还是坏主意？

Answer 1

他们的方法处理旧浏览器（所有if(element.addEventListener)内容）并在加载完成后删除事件处理程序。这可以节省内存，因为它允许回调和事件处理程序被垃圾收集。

<强>更新

是的，您的新方法现在可以处理旧浏览器，并且由于您没有悬空事件处理程序，因此应该节省内存。