After the AJAX call is completed a message box

Before writing because some validation, will be used after the call success or failure of some of the message box, but did not find a find a lot more appropriate for some of the components in the frame with the feeling is not very convenient, so they used to write js a simple message box, the code is as follows:

var appendHTML = function (EL, HTML) {
     var divTemp = document.createElement ( "div"), Nodes = null 
        // document fragments, disposable append, to improve performance 
        , the fragment = document.createDocumentFragment (); 
    divTemp.innerHTML = HTML ; 
    Nodes = divTemp.childNodes;
     for ( var I = 0, length = nodes.length; I <length; + = I. 1 ) { 
       fragment.appendChild (Nodes [I] .cloneNode ( to true )); 
    } 
    el.appendChild (the fragment ); 
    // It is said that following this way the world will be more clean 
    Nodes = null  ;
    the fragment= null;
};

function showMessage(message,type,time) {
        let str = ''
        switch (type) {
            case 'success':
                str = '<div class="success-message" style="width: 300px;height: 40px;text-align: center;background-color:#daf5eb;;color: rgba(59,128,58,0.7);position: fixed;left: 50%;top: 30%;transform:translate(-50%,-50%);line-height: 40px;border-radius: 5px;z-index: 9999">\n' +
                    '    <span class="mes-text">'+message+'</span></div>'break;
            case 'error':
                str
                = '<div class="error-message" style="width: 300px;height: 40px;text-align: center;background-color: #f5f0e5;color: rgba(238,99,99,0.8);position: fixed;left: 50%;top: 30%;transform:translate(-50%,-50%);line-height: 40px;border-radius: 5px;;z-index: 9999">\n' +
                    '    <span class="mes-text">'+message+'</span></div>'
        }
        appendHTML( document.querySelector('body') , str );
        setTimeout(function () {
            document.querySelector('body').removeChild(document.querySelector('.'+type+'-message'));
        },Time) 
'added successfully', 'success', 221000)
showMessage (
    }

Guess you like

Origin www.cnblogs.com/7qin/p/12117318.html