更新文本但不更新样式操作

时间:2016-09-07 01:54:03

标签: javascript html css

甚至不确定这是怎么可能的,或者我只是完全愚蠢......它有时会起作用,但大部分时间都不起作用......我已经清除了缓存以及所有这些......使用Chrome浏览器...尝试在Chrome中调试但仍然没有...我的终端没有控制台错误......绿点应该是红色......但它不是......但文本看起来非常好...



function init()
{
	updateIS2data();
    setInterval(updateIS2data, 1000);
}

function updateIS2data()
{
	var BP = 100;//getBatteryPercent();
	var BS = 2//getBatteryState();
	var LPM = "false";//isLowPower();
	var txtLPM = "";
	
	document.getElementById("battLevel").innerHTML = txtLPM + " " + BP + "%";
	var BatteryImage = document.getElementById('BatteryImageLevel');
	if(BP > 95){ w = 20; BatteryImage.style.backgroundColor = "RGB(50, 205, 50)"; }
	else if(BP <= 95 && BP > 90) { w = 19; BatteryImage.style.backgroundColor = "RGB(75, 205, 50)"; }
	else if(BP <= 90 && BP > 85) {  w = 18; BatteryImage.style.backgroundColor = "RGB(100, 205, 50)"; }
	else if(BP <= 85 && BP > 80) {  w = 17; BatteryImage.style.backgroundColor = "RGB(125, 205, 50)"; }
	else if(BP <= 80 && BP > 75) {  w = 16;  BatteryImage.style.backgroundColor = "RGB(150, 205, 50)"; }
	else if(BP <= 75 && BP > 70) {  w = 15; BatteryImage.style.backgroundColor = "RGB(175, 205, 50)"; }
	else if(BP <= 70 && BP > 65) {  w = 14; BatteryImage.style.backgroundColor = "RGB(200, 205, 50)"; }
	else if(BP <= 65 && BP > 60) {  w = 13; BatteryImage.style.backgroundColor = "RGB(225, 205, 50)"; }
	else if(BP <= 60 && BP > 55) {  w = 12; BatteryImage.style.backgroundColor = "RGB(250, 205, 50)"; }
	else if(BP <= 55 && BP > 50) {  w = 11; BatteryImage.style.backgroundColor = "RGB(250, 195, 50)"; }
	else if(BP <= 50 && BP > 45) {  w = 10; BatteryImage.style.backgroundColor = "RGB(250, 165, 50)"; }
	else if(BP <= 45 && BP > 40) {  w = 9; BatteryImage.style.backgroundColor = "RGB(250, 155, 50)"; }
	else if(BP <= 40 && BP > 35) {  w = 8; BatteryImage.style.backgroundColor = "RGB(250, 145, 50)"; }
	else if(BP <= 35 && BP > 30) {  w = 7; BatteryImage.style.backgroundColor = "RGB(250, 135, 50)"; }
	else if(BP <= 30 && BP > 25) {  w = 6; BatteryImage.style.backgroundColor = "RGB(250, 125, 50)"; }
	else if(BP <= 25 && BP > 20) {  w = 5; BatteryImage.style.backgroundColor = "RGB(250, 115, 50)"; }
	else if(BP <= 20 && BP > 15) {  w = 4; BatteryImage.style.backgroundColor = "RGB(250, 105, 50)"; }
	else if(BP <= 15 && BP > 10) {  w = 3; BatteryImage.style.backgroundColor = "RGB(250, 95, 50)"; }
	else if(BP <= 10 && BP > 5) {  w = 2; BatteryImage.style.backgroundColor = "RGB(250, 85, 50)"; }
	else if(BP <= 5 && BP > 0) {  w = 1; BatteryImage.style.backgroundColor = "RGB(205, 50, 50)"; }
	BatteryImage.style.width = w;
	
	if(BS == 1) document.getElementById('isCharging').style.display = "none";
	else if(BS == 2) document.getElementById('isCharging').style.display = "block";
	
	var dLPM = document.getElementById("isLowPowerMode");
	if(LPM == "false")
	{
		dLPM.innerHTML = "Testing";
		dLPM.style.backgroundColor = "red;";
	} else {
		dLPM.style.position = "asfdasfdasfd";
	}


	//RAM Stats//
	//document.getElementById("freeRam").innerHTML = getRam() + "MB";
	document.getElementById("freeRam").innerHTML = "1000MB";

	//devicename//
	//document.getElementById("dName").innerHTML = deviceName();
	document.getElementById("dName").innerHTML = "ShadowEvil's iPhone";
}
&#13;
html
{
	position:absolute;
	margin:0px 0px;
	padding: 0;
}

@font-face
{
	font-family: def;
	src: url(../Fonts/Nokio-Light.ttf);
}
@font-face
{
	font-family: def1;
	src: url(../Fonts/Nokio-Regular.ttf);
}
@font-face
{
	font-family: def2;
	src: url(../Fonts/Nokio-Medium.ttf);
}

body
{
	background: url('../Images/bg.png') no-repeat;
	background-size: 320px;
	padding: 0;
	margin: 0;
}

#battLevel
{
	position: absolute;
	width:320px;
	top:27px;
	left: -30px;
	color:fffffd;
	font-size:10px;
	font-family: def1;
	z-index:15;
	text-align:right;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
} 

#BatteryImage
{
	position: absolute;
	width: 22px;
	height: 7px;
	top:29px;
	left: 292px;
	z-index:10;
	border: 1px solid white;
	Border-radius: 15px;
}

#isCharging
{
	margin-top: -6px;
	margin: -6px auto 0 auto;
	width: 20px;
	height: 7px;
	background: url('../Images/charging.png') no-repeat;
}

#isLowPowerMode
{
	position: absolute;
	left: 254px;
	top: 29px;
	width: 10px;
	height: 10px;
	z-index: 15;
	background-color: limegreen;
	Border-radius: 10px;
}

#BatteryImage #BatteryImageLevel
{
	margin-top: 1px;
	margin-left: 1px;
	width: 20px;
	height: 5px;
	z-index:15;
	background-color: limegreen;
	Border-radius: 15px;
}

#freeRam{
	position: absolute;
	width:320px;
	top:27px;
	left:0px;
	margin-left: 10px;
	color:fffffd;
	font-size:10px;
	font-family: def1;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
	z-index:15;
}

#dName
{
	position: absolute;
	width:320px;
	top:21px;
	left:0px;
	color:fffffd;
	font-size:10px;
	font-family: def1;
	z-index:15;
	text-align:center;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
}

#DateWrap
{
	position: absolute;
	width:320px;
	top:30px;
	left:0px;
	color:fffffd;
	font-size:10px;
	font-family: def1;
	z-index:16;
	text-align:center;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
}
#line{
  position: absolute;
  top:0px;
  left:0px;
  height:42px;
  width:320px;
  Border-radius:0;
  background-color: #383838;
  border-bottom: 1px solid white;
  z-index:8;
  opacity:0.85;
}
#circle3{
  position: absolute;
  top:21px;
  left:250px;
  height:45px;
  width:45px;
  Border-radius:100px;
  background-color:383838;
  border-bottom: 1px solid white;
  border-left: 1px solid white;
  border-right: 1px solid white;
  z-index:8;
  opacity:1.0;
}
#circle4{
  position: absolute;
  top:26px;
  left:256px;
  height:35px;
  width:35px;
  Border-radius:100px;
  background-color:fffffd;
  border: 1px solid none;
  z-index:8;
  opacity:1.0;
}
&#13;
<html>
<head>
    <title>P.iW.14</title>
<!--Scripts JunesiPhone, IS2 Matchstic, mod J3T,-->
	<meta name="viewport" content="width=320, height=568, initial-scale=1, maximum-scale=1, user-scalable=no">
	<script src="Config.js"></script> 
	<script src="js/Library/lang.js"></script> 
	<link rel="stylesheet" type="text/css" href="css/main.css">
</head>

<script src="js/IS2.js"></script>
<script src="js/Library/clock.js"></script>
<script type="text/cycript">
      var getBatteryPercent = function() { return [IS2System batteryPercent]; };
	  var getBatteryState = function() { return [IS2System batteryStateAsInteger]; };
	  var getRam = function() { return [IS2System ramFree]; };
	  var getSignal = function() { return [IS2Telephony phoneSignalBars]; }; 
	  var airplaneMode = function() { return [IS2Telephony airplaneModeEnabled]; }
	  var WifiOn = function() { return [IS2Telephony dataConnectionAvailableViaWiFi]; }; 
	  var WifiSignal = function() { return [IS2Telephony wifiSignalBars]; }; 
	  var deviceName = function() { return [[UIDevice currentDevice] name]; };
	  var isLowPower = function() { return [[NSProcessInfo processInfo] isLowPowerModeEnabled]; };
</script>

<body onload="init()">
<!--Library that handles clock info NO-EDIT-->
       <div id="DateWrap">
		<a id="month"></a> <a id="date"></a> <a id="year"></a>
       </div>
    <script src="js/clockMain.js"></script>
<!--END Clock Widget-->

<div id="line"></div>
<div id="isLowPowerMode"></div>
<div id="battLevel"></div>
<div id="BatteryImage"><div id="BatteryImageLevel"></div><div id="isCharging"></div></div>
<div id="freeRam"></div>
<div id="dName"></div>

<script>

var width = window.innerWidth;

if(width == 375)
{
	viewport = document.querySelector("meta[name=viewport]");
	viewport.setAttribute('content', 'width=device-width, initial-scale=1.18, maximum-scale=1.18, user-scalable=0');
} else if(width == 414 ) {
	viewport = document.querySelector("meta[name=viewport]");
	viewport.setAttribute('content', 'width=device-width, initial-scale=1.3, maximum-scale=1.3, user-scalable=0');
}

</script>

	
</body>
</html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

添加内联样式时不需要使用分号。它们会导致错误。 dLPM.style.backgroundColor =&#34; red&#34 ;;

&#13;
&#13;
function init()
{
	updateIS2data();
    setInterval(updateIS2data, 1000);
}

function updateIS2data()
{
	var BP = 10;//getBatteryPercent();
	var BS = 2//getBatteryState();
	var LPM = "false";//isLowPower();
	var txtLPM = "";
	
	document.getElementById("battLevel").innerHTML = txtLPM + " " + BP + "%";
	var BatteryImage = document.getElementById('BatteryImageLevel');
	if(BP > 95){ w = 20; BatteryImage.style.backgroundColor = "RGB(50, 205, 50)"; }
	else if(BP <= 95 && BP > 90) { w = 19; BatteryImage.style.backgroundColor = "RGB(75, 205, 50)"; }
	else if(BP <= 90 && BP > 85) {  w = 18; BatteryImage.style.backgroundColor = "RGB(100, 205, 50)"; }
	else if(BP <= 85 && BP > 80) {  w = 17; BatteryImage.style.backgroundColor = "RGB(125, 205, 50)"; }
	else if(BP <= 80 && BP > 75) {  w = 16;  BatteryImage.style.backgroundColor = "RGB(150, 205, 50)"; }
	else if(BP <= 75 && BP > 70) {  w = 15; BatteryImage.style.backgroundColor = "RGB(175, 205, 50)"; }
	else if(BP <= 70 && BP > 65) {  w = 14; BatteryImage.style.backgroundColor = "RGB(200, 205, 50)"; }
	else if(BP <= 65 && BP > 60) {  w = 13; BatteryImage.style.backgroundColor = "RGB(225, 205, 50)"; }
	else if(BP <= 60 && BP > 55) {  w = 12; BatteryImage.style.backgroundColor = "RGB(250, 205, 50)"; }
	else if(BP <= 55 && BP > 50) {  w = 11; BatteryImage.style.backgroundColor = "RGB(250, 195, 50)"; }
	else if(BP <= 50 && BP > 45) {  w = 10; BatteryImage.style.backgroundColor = "RGB(250, 165, 50)"; }
	else if(BP <= 45 && BP > 40) {  w = 9; BatteryImage.style.backgroundColor = "RGB(250, 155, 50)"; }
	else if(BP <= 40 && BP > 35) {  w = 8; BatteryImage.style.backgroundColor = "RGB(250, 145, 50)"; }
	else if(BP <= 35 && BP > 30) {  w = 7; BatteryImage.style.backgroundColor = "RGB(250, 135, 50)"; }
	else if(BP <= 30 && BP > 25) {  w = 6; BatteryImage.style.backgroundColor = "RGB(250, 125, 50)"; }
	else if(BP <= 25 && BP > 20) {  w = 5; BatteryImage.style.backgroundColor = "RGB(250, 115, 50)"; }
	else if(BP <= 20 && BP > 15) {  w = 4; BatteryImage.style.backgroundColor = "RGB(250, 105, 50)"; }
	else if(BP <= 15 && BP > 10) {  w = 3; BatteryImage.style.backgroundColor = "RGB(250, 95, 50)"; }
	else if(BP <= 10 && BP > 5) {  w = 2; BatteryImage.style.backgroundColor = "RGB(250, 85, 50)"; }
	else if(BP <= 5 && BP > 0) {  w = 1; BatteryImage.style.backgroundColor = "RGB(205, 50, 50)"; }
	BatteryImage.style.width = w;
	
	if(BS == 1) document.getElementById('isCharging').style.display = "none";
	else if(BS == 2) document.getElementById('isCharging').style.display = "block";
	
	var dLPM = document.getElementById("isLowPowerMode");
	if(LPM == "false")
	{
		dLPM.innerHTML = "Testing";
		dLPM.style.backgroundColor = "red";
	} else {
		dLPM.style.position = "asfdasfdasfd";
	}


	//RAM Stats//
	//document.getElementById("freeRam").innerHTML = getRam() + "MB";
	document.getElementById("freeRam").innerHTML = "1000MB";

	//devicename//
	//document.getElementById("dName").innerHTML = deviceName();
	document.getElementById("dName").innerHTML = "ShadowEvil's iPhone";
}
&#13;
html
{
	position:absolute;
	margin:0px 0px;
	padding: 0;
}

@font-face
{
	font-family: def;
	src: url(../Fonts/Nokio-Light.ttf);
}
@font-face
{
	font-family: def1;
	src: url(../Fonts/Nokio-Regular.ttf);
}
@font-face
{
	font-family: def2;
	src: url(../Fonts/Nokio-Medium.ttf);
}

body
{
	background: url('../Images/bg.png') no-repeat;
	background-size: 320px;
	padding: 0;
	margin: 0;
}

#battLevel
{
	position: absolute;
	width:320px;
	top:27px;
	left: -30px;
	color:fffffd;
	font-size:10px;
	font-family: def1;
	z-index:15;
	text-align:right;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
} 

#BatteryImage
{
	position: absolute;
	width: 22px;
	height: 7px;
	top:29px;
	left: 292px;
	z-index:10;
	border: 1px solid white;
	Border-radius: 15px;
}

#isCharging
{
	margin-top: -6px;
	margin: -6px auto 0 auto;
	width: 20px;
	height: 7px;
	background: url('../Images/charging.png') no-repeat;
}

#isLowPowerMode
{
	position: absolute;
	left: 254px;
	top: 29px;
	width: 10px;
	height: 10px;
	z-index: 15;
	background-color: limegreen;
	Border-radius: 10px;
}

#BatteryImage #BatteryImageLevel
{
	margin-top: 1px;
	margin-left: 1px;
	width: 20px;
	height: 5px;
	z-index:15;
	background-color: limegreen;
	Border-radius: 15px;
}

#freeRam{
	position: absolute;
	width:320px;
	top:27px;
	left:0px;
	margin-left: 10px;
	color:fffffd;
	font-size:10px;
	font-family: def1;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
	z-index:15;
}

#dName
{
	position: absolute;
	width:320px;
	top:21px;
	left:0px;
	color:fffffd;
	font-size:10px;
	font-family: def1;
	z-index:15;
	text-align:center;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
}

#DateWrap
{
	position: absolute;
	width:320px;
	top:30px;
	left:0px;
	color:fffffd;
	font-size:10px;
	font-family: def1;
	z-index:16;
	text-align:center;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
}
#line{
  position: absolute;
  top:0px;
  left:0px;
  height:42px;
  width:320px;
  Border-radius:0;
  background-color: #383838;
  border-bottom: 1px solid white;
  z-index:8;
  opacity:0.85;
}
#circle3{
  position: absolute;
  top:21px;
  left:250px;
  height:45px;
  width:45px;
  Border-radius:100px;
  background-color:383838;
  border-bottom: 1px solid white;
  border-left: 1px solid white;
  border-right: 1px solid white;
  z-index:8;
  opacity:1.0;
}
#circle4{
  position: absolute;
  top:26px;
  left:256px;
  height:35px;
  width:35px;
  Border-radius:100px;
  background-color:fffffd;
  border: 1px solid none;
  z-index:8;
  opacity:1.0;
}
&#13;
<html>
<head>
    <title>P.iW.14</title>
<!--Scripts JunesiPhone, IS2 Matchstic, mod J3T,-->
	<meta name="viewport" content="width=320, height=568, initial-scale=1, maximum-scale=1, user-scalable=no">
	<script src="Config.js"></script> 
	<script src="js/Library/lang.js"></script> 
	<link rel="stylesheet" type="text/css" href="css/main.css">
</head>

<script src="js/IS2.js"></script>
<script src="js/Library/clock.js"></script>
<script type="text/cycript">
      var getBatteryPercent = function() { return [IS2System batteryPercent]; };
	  var getBatteryState = function() { return [IS2System batteryStateAsInteger]; };
	  var getRam = function() { return [IS2System ramFree]; };
	  var getSignal = function() { return [IS2Telephony phoneSignalBars]; }; 
	  var airplaneMode = function() { return [IS2Telephony airplaneModeEnabled]; }
	  var WifiOn = function() { return [IS2Telephony dataConnectionAvailableViaWiFi]; }; 
	  var WifiSignal = function() { return [IS2Telephony wifiSignalBars]; }; 
	  var deviceName = function() { return [[UIDevice currentDevice] name]; };
	  var isLowPower = function() { return [[NSProcessInfo processInfo] isLowPowerModeEnabled]; };
</script>

<body onload="init()">
<!--Library that handles clock info NO-EDIT-->
       <div id="DateWrap">
		<a id="month"></a> <a id="date"></a> <a id="year"></a>
       </div>
    <script src="js/clockMain.js"></script>
<!--END Clock Widget-->

<div id="line"></div>
<div id="isLowPowerMode"></div>
<div id="battLevel"></div>
<div id="BatteryImage"><div id="BatteryImageLevel"></div><div id="isCharging"></div></div>
<div id="freeRam"></div>
<div id="dName"></div>

<script>

var width = window.innerWidth;

if(width == 375)
{
	viewport = document.querySelector("meta[name=viewport]");
	viewport.setAttribute('content', 'width=device-width, initial-scale=1.18, maximum-scale=1.18, user-scalable=0');
} else if(width == 414 ) {
	viewport = document.querySelector("meta[name=viewport]");
	viewport.setAttribute('content', 'width=device-width, initial-scale=1.3, maximum-scale=1.3, user-scalable=0');
}

</script>

	
</body>
</html>
&#13;
&#13;
&#13;