利用js实现网页开关灯

需求：网上有一些人不喜欢白色的页面（特别是在晚上，这样阅读可以保护眼睛），所以就要求网页有开灯和关灯模式。

思路：
1.直接更换颜色，比如，body的底色可以由白色更换为黑色
2.更换背景图片，比如，白天的背景是蓝天白云，晚上就可以是星空皓月。

代码：
实现1：利用js函数，更改背景的颜色。【需要引入jQuery.js文件才能实现】

<button>开灯</button>
	<button>关灯</button>
	<div id="house"></div>
	<script type="text/javascript">
		$(function(){
			//获得按钮(元素js的dom对象)
			var buttons=document.getElementsByTagName('button');
			//关灯
			buttons[1].onclick=function(){
			//利用jq选择器获得jq对象并修改其背景颜色
			$('body').css('backgroundColor','black');	
			}
			
			//开灯
			//把一个原生的dom对象转化为jq对象，并改变其背景颜色
			$(buttons[0]).click(function(){
				$('body')[0].style.background='white';
			});
		});
	</script>

实现2：这个跟上面的例子其实原理类似，就是修改背景图片，这里不做赘述。