Javascript 基础教程之显示隐藏实例

实例

代码如下：

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>事件</title>
	<style type="text/css"> 
		div{
			width:150px;height:150px;background:#f60;
		}
	</style>	
</head>
<body>
		<div id="dv"></div><br>

		<input type="button" value="隐藏" onclick="bt()">
		<input type="button" value="显示" onclick="bt1()">

		<script type="text/javascript">
			function bt(){
				var div=document.getElementById("dv");
	        	div.style.display="none";
			}
			function bt1(){
				var div=document.getElementById("dv");
	        	div.style.display="block";
			}
		</script>
</body>
</html>

继续学习

新建文件

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>事件</title> <style type="text/css"> div{ width:150px;height:150px;background:#f60; } </style> </head> <body> <div id="dv"></div><br> <input type="button" value="隐藏" onclick="bt()"> <input type="button" value="显示" onclick="bt1()"> <script type="text/javascript"> function bt(){ var div=document.getElementById("dv"); div.style.display="none"; } function bt1(){ var div=document.getElementById("dv"); div.style.display="block"; } </script> </body> </html>

提交重置代码

自动运行

章节

笔记

提问

课件

反馈

捐赠