window.onload=function(){
aa();
}
function aa(){
var body=document.body,
p=document.createElement('p'),
span=document.createElement('span'),
h3=document.createElement('h3');
h3.innerHTML='X';
span.appendChild(h3);
body.appendChild(span);
body.appendChild(p);
span.className='hide';
p.className='hide';
var btn=document.getElementById('btn');
btn.onclick=bb;
h3.onclick=cc;
document.onclick=cc;
}
function bb(event){
event?event:window.event;
event.stopPropagation?event.stopPropagation():cancelBubble=true;
var span=document.getElementsByTagName('span')[0],
p=document.getElementsByTagName('p')[0],
h3=document.getElementsByTagName('h3')[0];
span.className='show';
p.className='show';
}
function cc(){
var span=document.getElementsByTagName('span')[0],
p=document.getElementsByTagName('p')[0],
h3=document.getElementsByTagName('h3')[0];
span.className='hide';
p.className='hide';
}bb和cc写在外部它的上一级作用域还是aa吗，这段代码怎么样才能精简<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>带遮罩的登陆框</title>
<link rel="stylesheet" type="text/css" href="css/1.css"/>
<script src="js/1.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<input type="button" id="btn" value="按钮" />
<img src="http://pic.ytqmx.com:82/2013/0331/07/17.jpg"/>
<img src="http://pic.ytqmx.com:82/2013/0331/07/18.jpg"/>
</body>
</html>*{
margin: 0;
padding: 0;
}
#btn{
cursor: pointer;
}
p{
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: 100%;
background: darkgray;
opacity: 0.5;
z-index: 80;
}
span{
width: 300px;
height: 200px;
background: cadetblue;
position: fixed;
left: 50%;
top: 50%;
margin-top: -100px;
margin-left: -150px;
z-index: 100;
}
h3{
position: absolute;
right: 10px;
top: 5px;
cursor: pointer;
}
.hide{
display: none;
}
.show{
display: block;
}
添加回答
举报
0/150
提交
取消