js学习二：按钮显示或隐藏下拉菜单简单案例

最新推荐文章于 2024-06-13 09:00:00 发布

那丶

最新推荐文章于 2024-06-13 09:00:00 发布

阅读量5.4k

点赞数

分类专栏： JS漫长学习路

本文链接：https://blog.csdn.net/zy1030070058/article/details/47294323

版权

JS漫长学习路专栏收录该内容

4 篇文章 0 订阅

订阅专栏

Html代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>按钮显示或隐藏下拉菜单简单案例</title>
    <style type="text/css">
    #div1{
    	width: 80px;
    	height: 200px;
    	background: red;
    	display: none;
    }
    </style>
</head>
<body id="body">
	<input id="button1" type="button" value="button"/>
	<div id="div1">
	</div>
	<script type="text/javascript" src="index.js" ></script>
</body>
</html>

JS代码

window.οnlοad=show;
function show(){
	var bt=document.getElementById("button1");
	bt.οnclick=function(){
		var oDiv=document.getElementById("div1");
		if(oDiv.style.display=="block"){
			oDiv.style.display="none";
		}else{
			oDiv.style.display="block";
		}
	}
}

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

那丶

关注关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
2
评论
js学习二：按钮显示或隐藏下拉菜单简单案例

Html代码：按钮显示或隐藏下拉菜单简单案例 #div1{ width: 80px; height: 200px; background: red; display: none; } JS代码window.onload=show;function show(){
复制链接

扫一扫