js实现加buff功能

 html部分

	<button id = "addBlue">加蓝buff</button>
	<button id = "addRed">加红buff</button>
	<div id="blue"></div>
	<div id="red"></div>

 css样式

    	#blue{
    		color:blue;
    	}
    	#red{
    		color:red;
    	}

 js段

1.采用本地存储localStorage 储存buff值及获取buff的时间

2.每秒刷新，使当前状态得到更新

		var addBlue = document.querySelector("#addBlue"),
			addRed = document.querySelector("#addRed"),
			blue = document.querySelector("#blue"),
			red = document.querySelector("#red"),
			nowTime = new Date().getTime()/1000;
		localStorage.removeItem(localStorage.blue);

		if(localStorage.blue){
			blue.innerHTML = localStorage.blue;
		}else{
			blue.innerHTML = "";
		}

		if(localStorage.red){
			red.innerHTML = localStorage.red;
		}else{
			red.innerHTML = "";
		}

		if(localStorage.blueTime){
			if(nowTime-localStorage.blueTime > 5){
				localStorage.removeItem("blue");
				localStorage.removeItem("blueTime");
				//注意键值要加引号
			}
		}

		if(localStorage.redTime){
			if(nowTime-localStorage.redTime > 5){
				localStorage.removeItem("red");
				localStorage.removeItem("redTime");
				//注意键值要加引号
			}
		}

		addBlue.onclick = function(){
			localStorage.setItem("blue","获得蓝buff");
			localStorage.setItem("blueTime",new Date().getTime()/1000);
		}
		addRed.onclick = function(){
			localStorage.setItem("red","获得红buff");
			localStorage.setItem("redTime",new Date().getTime()/1000);
		}
		//实现状态刷新
		setTimeout(function(){
			location.reload();
		},1000);

也可在meta部分写入

    <meta http-equiv="refresh" content="1">

实现每秒刷新