window.alert = alert;
function alert(data) {
// 创建元素
var a = document.createElement("div"),
div1 = document.createElement("div"),
div2 = document.createElement("div"),
h3 = document.createElement("h3"),
p = document.createElement("p"),
btn = document.createElement("div"),
h3Text = document.createTextNode("提示");
textNode = document.createTextNode(data ? data : ""),
btnText = document.createTextNode("确定");
// 控制元素样式
css(div1, {
"width": "100%",
"height": "100%",
"position": "fixed",
"left": "0",
"top": "0",
"bottom": "0",
"right": "0",
"margin": "0 auto",
"z-index": "999998",
"background-color": "#666666",
"opacity": "0.5"
});
css(div2, {
"width": "472px",
"height": "160px",
"min-height": "160px",
"max-height": "500px",
"position": "fixed",
"background-color": "#fff",
"top": "0",
"right": "0",
"left": "0",
"bottom": "0",
"margin": "auto",
"text-align": "center",
"z-index": "999999"
});
css(h3, {
"background": "#FF0000",
"margin": "0",
"line-height": "54px",
"color": "#fff",
"text-align": "center"
});
css(btn, {
"cursor": "pointer",
"background-color": "#146AC0",
"color": "#ffffff",
"border": "1px solid #c5c5c7",
"width": "102px",
"height": "40px",
"line-height": "40px",
"border-radius": "5px",
"margin-left": "40%"
});
// 内部结构套入
h3.appendChild(h3Text);
p.appendChild(textNode);
btn.appendChild(btnText);
div2.appendChild(h3);
div2.appendChild(p);
div2.appendChild(btn);
a.appendChild(div1);
a.appendChild(div2);
// 整体显示到页面内
document.getElementsByTagName("body")[0].appendChild(a);
// 确定绑定点击事件删除标签
btn.onclick = function() {
a.parentNode.removeChild(a);
}
}
function css(targetObj, cssObj) {
var str = targetObj.getAttribute("style") ? targetObj.getAttribute("style") : "";
for(var i in cssObj) {
str += i + ":" + cssObj[i] + ";";
}
targetObj.style.cssText = str;
}
更改alert样式
最新推荐文章于 2024-05-17 05:47:44 发布