封装函数 弹窗

封装函数：

// args:
// {
// 	title:'温馨提示'
// 	content:"是否添加一个蓝色的div?"
// 	confirmFn:Function(){
// 		var bluediv = document.createElement('div')
// 		bluediv.style.backgroundColor = "blue"
// 		bluediv.style.width = "300px"
// 		bluediv.style.height = "300px"
// 		document.body.appendChild(bluediv)
// 	},
// 	cancelFn:Function(){
		
// 	}
// }



function lhqAlert(args){
	var zhezhao = document.createElement('div')
	zhezhao.className = "zhezhao";
	zhezhao.innerHTML = `
	<div class="alert">
		<div class="header">
			<span class="title">`+args.title+`</span>
			<span class="close">×</span>
		</div>
			<div class="main">
				`+args.content+`
			</div>
			<div class="btnList">
				<div class="btn confirm">确定</div>
				<div class="btn">取消</div>
			</div>
		</div>
	`
	
	var body = document.querySelector('body')
	body.appendChild(zhezhao)
	
	// 获取close元素
	var close = document.querySelector('.close')
	close.onclick = function(){
		body.removeChild(zhezhao)
	}
				
	
	// 添加
	var confirm = document.querySelector('.btn:nth-child(1)')
	confirm.onclick = function(){
		if(typeof args.confirmFn == 'function'){
			args.confirmFn()
		}else{
			console.log("传入参数，没有设确认函数");
		}	
		body.removeChild(zhezhao)
	}
	// 取消
	var exit = document.querySelector('.btn:nth-child(2)')
	exit.onclick = function(){
		if(typeof args.cancelFn == 'function'){
			args.cancelFn()
		}else{
			console.log("传入参数，没有设取消函数");
		}
		body.removeChild(zhezhao); 
	}
}