摘要:js制作灯泡小案例用js控制灯泡开关<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>
js制作灯泡小案例
用js控制灯泡开关
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>light</title>
<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<style>
.light{width: 300px; height: 300px; margin: 200px auto; line-height: 300px;}
.light i{border: 1px solid #fff; display: inline-block; color:#f2f2f2; font-size:200px; }
</style>
<script type="text/javascript">
var y=1;
function lightOpen(x){
if(y==1){
x.style.color='#f2f579';
y=0;
}else if(y==0){
x.style.color='#f2f2f2';
y=1;
}
}
</script>
</head>
<body>
<div class="light" >
<i class="fa fa-lightbulb-o " id="light_1" onclick="lightOpen(this)"></i>
</div>
</body>
</html>
批改老师:天蓬老师批改时间:2019-01-05 14:30:28
老师总结:js函数中的变量使用有意思的单词,尽量避免单个的字母和数字,这在软件开发中叫“魔术字符或魔术变量”,在大项目中是大忌