我想创建一个表单,为用户提供 3 个不同的选项来更改页面的背景颜色。当用户单击其中一个选项时,背景颜色会更改以匹配。并且还创建一个包含一些基本文本的 div 以开始。创建一个具有文本区域的表单。使用 document.getElementById('yourelementid') 查找文本区域的值并更改在 div 中创建的基本文本。 (提示:用户innerHTML)现在我知道如何做表单,但我不知道如何让它在用户单击该按钮时更改背景。我根本不明白如何使用innerHTML。如果有人可以解释或给我一些关于如何理解这一点的网站。谢谢。
好吧,这就是我到目前为止所拥有的,但我还不明白......
<!DOCTYPE html PUBLIC "-//W3C//DTD Xhtml 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http:www.w3.org/1999/xhtml">
<head>
<title>background-color</title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<script language="javascript" type="text/javascript">
function changeBackgroundColor(objDivID)
{
var backColor = new String();
backColor = document.getElementById(objDivID).style.backgroundColor;
if(backColor.toLowerCase()=='#A20000C')
{
document.getElementById(objDivID).style.backgroundColor = '#DF64BD';
}
else
{
document.getElementById(objDivID).style.backgroundColor = '#FFDD73';
}
}
</script>
</head>
<body>
<h3>Change background color to:</h3>
<div id="div1" style="background-color : #A2000C">
<p><input type="radio" name="color" value="red" />Red<br />
<input type="radio" name="color" value="pink" />Pink<br />
<input type="radio" name="color" value="yellow" />Yellow<br />
</div>
<input type="button" value="click here"onclick="changeBackgroundColor('div1')" />
</body>
</html>
我仍然不确定为什么我的盒子没有那么大并且没有改变颜色,我仍然必须在那里放一个盒子。要求更改文本的颜色。
最佳答案
您应该在颜色更改选项上添加一个事件处理程序,如下所示(假设它是一个选择框):
<select id="colorSelect">
<option value="red">red</option>
<option value="green">green></option>
</select>
document.colorSelect.onchange = function(){
document.elementToChangeColor.style.backgroundColor= this.value;
}
关于javascript - 我需要有关 javascript 中 DOM 的帮助,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5677317/