js实现 重写alert控件

来源:互联网 发布:ie11 跨域js不能执行 编辑:程序博客网 时间:2024/05/16 09:51

纯粹是为了打发时间,手写了一个JS的 alert控件。

代码如下:

<html><head><script type="text/javascript">var alertObj = new Object();var generalStyle = {zIndex: 0,width: "200px",height: "100px",border: "thick solid #CCCCCC",background: "#FFFFFF",position: "absolute",top: "35%",left: "40%"}var txtStyle = {textAlign: "center"}var btnStyle = {position: "absolute",left: "40%",top: "70%",color: "#333333",fontWeight: "bold",outlineColor:"#3366FF",outlineStyle:"ridge",outlineWidth:"thin",//outline: "thin ridge #3366FF",innerHTML: "OK"}alertObj = {generalSet: generalStyle,txtSet: txtStyle,btnSet: btnStyle,isExist: false}alertObj.createComponent = function() {var component = document.createElement(arguments[0]);var styles = arguments[1];for (var property in styles) {if (styles[property] != null) {    try{component.style[property] = styles[property];}catch(err){document.write(err.name+":"+property+"<br/>");//set property error!}}}return component;}alertObj.show = function() {    if(!this.isExist){this.isExist = true;var bodyObj = document.body;bodyObj.style.zIndex = -1;bodyObj.style.background = "#999999";var divObj = this.createComponent("div", this.generalSet);var txtObj = this.createComponent("p", this.txtSet);txtObj.innerHTML = arguments[0];var btnObj = this.createComponent("button", this.btnSet);btnObj.innerHTML = this.btnSet.innerHTML;btnObj.onclick = function() {bodyObj.style.zIndex=0;bodyObj.style.background="";bodyObj.removeChild(divObj);if(alertObj.isExist){alertObj.isExist = false;}}divObj.appendChild(txtObj);divObj.appendChild(btnObj);bodyObj.appendChild(divObj); }}function show(s) {alertObj.show(s);}</script></head><body><p onclick="show('inner test');">Click show alert</p></body></html>


原创粉丝点击