查看本章节
查看作业目录
需求说明：
根据在下拉列表框中选择的内容，决定页面效果
用户在下拉列表框中选择页面将 要使用的背景颜色
当用户选择橙色时，页面背景将显示为橙色网址:yii666.com文章来源地址:https://www.yii666.com/article/756094.html
文章地址https://www.yii666.com/article/756094.html
实现思路：
- 用表单 <select> 元素列出可以选择的背景颜色
- 在 JavaScript 脚本中设置 <select> 元素对象的 onchange 事件属性，让 onchange 事件属性值等于处理该事件的匿名函数
- 在匿名函数内部获取 <select> 元素的选项值，并设置为页面背景色 使用浏览器预览效果
实现代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>请选择背景颜色：</h1>
<select id="setColor" >
<option value="white">白</option>
<option value="purple">紫</option>
<option value="orange">橙</option>
<option value="gray">灰</option>
<option value="yellow">黄</option>
</select>
<script type="text/javascript">
document.getElementById("setColor").onchange = function(){
document.bgColor=this.value;
}
</script>
</body>
</html>