div的显示隐藏
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>div的显示与隐藏</title>
<script type="text/javascript" src="http://cdn.gbtags.com/jquery/1.11.1/jquery.min.js"></script>
<style type="text/css">
div{width:200px;height:200px;background:red;display:none;}
</style>
</head>
<body>
<input id="show_btn" type="button" value="显示">
<input id="hide_btn" type="button" value="隐藏" >
<div id="div1"></div>
</body>
</html>
<script type="text/javascript">
window.onload=function (){
var oBtn1=document.getElementById("show_btn");
var oBtn2=document.getElementById("hide_btn");
var oDiv=document.getElementById("div1");
oBtn1.onclick=function (){
oDiv.style.display="block";
oDiv.style.width="300px";
oDiv.style.background="yellow";
}
oBtn2.onclick=function (){
oDiv.style.display="none";
}
}
</script>
