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;
}
如何簡化這段js代碼
清風流光
2017-05-07 10:20:44