<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户登录</title>
<link rel="stylesheet" type="text/css" href="css/10.css"/>
<script src="js/10.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<p>亲，您好！</p>
<button id='btn'>登录</button>
</body>
</html>*{
padding: 0;
margin: 0;
}
.box{
width: 300px;
height: 180px;
background: #CCCCCC;
position: absolute;
left: 50%;
right: 50%;
top:50%;
bottom: 50%;
margin-top: -90px;
margin-left: -150px;
border: 1px solid #777777;
}
.pn{
height: 1.5em;
line-height: 1.5em;
border-bottom: 1px solid #777777;
}
.sn{
position: absolute;
right: 4px;
cursor: pointer;
}window.onload=function(){
aa()
}
var i=-1;
function xxx(){
// if(){}
var div=document.createElement('div'),
p=document.createElement('p'),
span=document.createElement('span');
p.innerHTML='用户登录';p.id='pid';p.className='pn'
span.innerText='X';span.className='sn';
div;div.className='box';
div.appendChild(p);
div.appendChild(span);
document.body.appendChild(div);
bb()
}
function yyy(){
var dd=document.getElementsByTagName('div')[i];
dd.style.display='none';
i++;
}
function aa(){
var btn=document.getElementById('btn');
if(addEventListener){
btn.addEventListener('click',xxx,false);
}else if(attachEvent){
btn.attachEvent('onclick',xxx);
}else{
btn.onclick=xxx;
}
i++;
}
function bb(){
var x=document.getElementsByTagName('span')[i];
x.onclick=yyy;
}ccs 中 .sn是相对与 .box进行绝对定位 为什么位置会在p标签的下方js中bug 怎么改 能做到html和js分离又没问题
添加回答
举报
0/150
提交
取消