浅谈JavaScript重写alert()方法

window.alert = function(str) {
	var alertBox = document.createElement("div");
	alertBox.id="alertBox";
	alertBox.style.position = "absolute";
	alertBox.style.width = "400px";
	alertBox.style.background = "#F2F2F2";
	alertBox.style.border = "1px solid grey";
	alertBox.style.left = "50%";
	alertBox.style.top = "50%";
	alertBox.style.transform = "translate(-50%, -50%)";
	alertBox.style.textAlign = "center";
	alertBox.style.zIndex = "100";
	var strHtml = "";
	strHtml += '<div id="title">提示:<div id="close" οnclick="certainFunc()"></div></div>';
	strHtml += '<div id="content">'+str+'</div>';
	strHtml += '<div id="certain"><input id="btn" type="button" value="确 定" οnclick="certainFunc()" onhover="hoverFunc()"/></div>';
	alertBox.innerHTML = strHtml;
	document.body.appendChild(alertBox);
	var title = document.getElementById("title");
	title.style.textAlign = "left";
	title.style.marginTop = "20px";
	title.style.paddingLeft = "20px";
	title.style.height = "30px";
	title.style.fontSize = "15px";
	var close = document.getElementById("close");
	close.style.width = "16px";
	close.style.height = "16px";
	close.style.marginRight = "20px";
	close.style.background = "url('images/close.png')";
	close.style.float = "right";
	var content = document.getElementById("content");
	content.style.margin = "20px";
	content.style.fontSize = "12px";
	var certain = document.getElementById("certain");
	certain.style.position = "relative";
	certain.style.height = "50px";
	certainFunc = function() {
		alertBox.parentNode.removeChild(alertBox);
	};
	var btn = document.getElementById("btn");
	btn.style.width = "60px";
	btn.style.height = "30px";
	btn.style.background = "#cccccc";
	btn.style.border = "1px solid grey";
	btn.style.position = "absolute";
	btn.style.borderRadius = "5px";
	btn.style.right = "20px";
	btn.style.bottom = "20px";
	btn.style.marginTop = "10px";
	btn.style.cursor = "pointer";
	btn.style.color = "#333";
	hoverFunc = function() {
		btn.style.border = "1px blue solid";
	};
}
  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值