问题描述
我有一个带太阳的按钮。单击按钮时，它的文本必须更改为RAIN，屏幕的最低部分必须将其背景颜色更改为绿色。
因此，当SUN = > BC是绿色，而BC = RED
我尝试过：
< script language =JavaScripttype =text / javascript>
函数SunRain（）{
if（document.getElementById（'AanUitKnop'）。 innerHTML =='SUN'）{
document.getElementById（'AanUitKnop'）。innerHTML ='RAIN';
} else {
document.getElementById（'AanUitKnop'）。innerHTML ='SUN';
}
}
没关系，但改变颜色不会work
I have one button with "Sun" on it. When I click the button, it's text must change to "RAIN", and the lowest part of the screen must change it's backcolor to Green.
So, when SUN => BC is GREEN otherwhile BC = RED
What I have tried:
<script language="JavaScript" type="text/javascript">
function SunRain() {
if (document.getElementById('AanUitKnop').innerHTML == 'SUN') {
document.getElementById('AanUitKnop').innerHTML = 'RAIN';
} else {
document.getElementById('AanUitKnop').innerHTML = 'SUN';
}
}
That's ok, but changing color doesn't work
推荐答案
<html>
<head>
<script language="JavaScript" type="text/javascript">
function SunRain() {
if (document.getElementById('AanUitKnop').innerHTML == 'SUN') {
document.getElementById('AanUitKnop').innerHTML = 'RAIN';
//document.body.style.background = 'red';
document.getElementById('lowersection').style.background = 'red';
} else {
document.getElementById('AanUitKnop').innerHTML = 'SUN';
//document.body.style.background = 'green';
document.getElementById('lowersection').style.background = 'green';
}
}
</script>
</head>
<body>
<a id="AanUitKnop" type="button" onclick="SunRain()" href="#">SUN</a>
<div id="lowersection" style="height:500px;width:500px;"></div>
</body>
</html>
希望这对您有所帮助。
Hope this will definitely of help to you.
document.getElementById('lowersection').style.backgroundColor = 'green';
这篇关于单击按钮可更改文本和颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！