js实现灯泡的开和灭
2016-02-23 13:07
627 查看
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
<style type="text/css">
.div_1{width:160px;height:216px;background-image:url(bulb_off.png);}
.div_2{width:160px;height:216px;background-image:url(bulb_on.png);}
</style>
<script language="javascript">
function openlamp(){
var div = document.getElementById("lamp");
div.className ="div_2";
}
function closelamp(){
var div = document.getElementById("lamp");
div.className ="div_1";
}
</script>
</head>
<body>
<div class="div_2" id="lamp">
</div>
<input type="button" value="开" onclick="openlamp()"/>
<input type="button" value="关" onclick="closelamp()"/>
</body>
</html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
<style type="text/css">
.div_1{width:160px;height:216px;background-image:url(bulb_off.png);}
.div_2{width:160px;height:216px;background-image:url(bulb_on.png);}
</style>
<script language="javascript">
function openlamp(){
var div = document.getElementById("lamp");
div.className ="div_2";
}
function closelamp(){
var div = document.getElementById("lamp");
div.className ="div_1";
}
</script>
</head>
<body>
<div class="div_2" id="lamp">
</div>
<input type="button" value="开" onclick="openlamp()"/>
<input type="button" value="关" onclick="closelamp()"/>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- [javascript基础]constructor与prototype
- js点击子菜单折叠,再点击子菜单展开
- echarts地图 json数据 和 后套动态数据加载
- js实现动态表格
- 基于javascript上手正则表达式
- js方式实现页面跳转或刷新
- javascript的数组创建及方法
- JavaScript简单实现鼠标移动切换图片的方法
- js判断是否是闰年
- JavaScript函数补完：toString()
- JSON中get()和opt()的区别
- JavaScript添加随滚动条滚动窗体的方法
- 理解javascript定时器中的单线程
- Javascript调用C#后台方法及JSon解析
- jsoup是如何选择指定元素的
- javascript 小白学习指南专题 作用域与上下文环境之间的联系
- JavaScript NaN 属性
- Extjs模型类的声明与实例化和调用
- javascript每日必学之多态
- js创建对象的6种方式