用js手写一个loading遮罩层

// 显示loading遮罩层
export function loading() {
    var mask_bg = document.createElement('div')
    mask_bg.id = 'mask_bg'
    mask_bg.style.position = 'absolute'
    mask_bg.style.top = '0px'
    mask_bg.style.left = '0px'
    mask_bg.style.width = '100%'
    mask_bg.style.height = '100%'
    mask_bg.style.backgroundColor = '#777'
    mask_bg.style.opacity = 0.6
    mask_bg.style.zIndex = 10001
    document.body.appendChild(mask_bg)
    var mask_msg = document.createElement('div')
    mask_msg.style.position = 'absolute'
    mask_msg.style.top = '35%'
    mask_msg.style.left = '42%'
    mask_msg.style.backgroundColor = 'white'
    mask_msg.style.border = '#336699 1px solid'
    mask_msg.style.textAlign = 'center'
    mask_msg.style.fontSize = '1.1em'
    mask_msg.style.fontWeight = 'bold'
    mask_msg.style.padding = '0.5em 3em 0.5em 3em'
    mask_msg.style.zIndex = 10002
    mask_msg.innerText = 'loading...'
    mask_bg.appendChild(mask_msg)
}
// 关闭遮罩层
export function loaded() {
    var mask_bg = document.getElementById('mask_bg')
    if (mask_bg != null) mask_bg.parentNode.removeChild(mask_bg)
}