js实现加buff功能

功能"/>

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">

实现每秒刷新