js重写alert控件(适合学习js的新手朋友)
纯粹是为了打发时间，手写了一个JS的alert控件。
代码如下：
<html>
<head>
<scripttype="text/javascript">
varalertObj=newObject();
vargeneralStyle={
zIndex:0,
width:"200px",
height:"100px",
border:"thicksolid#CCCCCC",
background:"#FFFFFF",
position:"absolute",
top:"35%",
left:"40%"
}
vartxtStyle={
textAlign:"center"
}
varbtnStyle={
position:"absolute",
left:"40%",
top:"70%",
color:"#333333",
fontWeight:"bold",
outlineColor:"#3366FF",
outlineStyle:"ridge",
outlineWidth:"thin",
//outline:"thinridge#3366FF",
innerHTML:"OK"
}
alertObj={
generalSet:generalStyle,
txtSet:txtStyle,
btnSet:btnStyle,
isExist:false
}
alertObj.createComponent=function(){
varcomponent=document.createElement(arguments[0]);
varstyles=arguments[1];
for(varpropertyinstyles){
if(styles[property]!=null){
try{
component.style[property]=styles[property];
}catch(err){
document.write(err.name+":"+property+"<br/>");//setpropertyerror!
}
}
}
returncomponent;
}
alertObj.show=function(){
if(!this.isExist){
this.isExist=true;
varbodyObj=document.body;
bodyObj.style.zIndex=-1;
bodyObj.style.background="#999999";
vardivObj=this.createComponent("div",this.generalSet);
vartxtObj=this.createComponent("p",this.txtSet);
txtObj.innerHTML=arguments[0];
varbtnObj=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);
}
}
functionshow(s){
alertObj.show(s);
}
</script>
</head>
<body>
<ponclick="show('innertest');">Clickshowalert</p>
</body>
</html>