使用 JavaScript 的 HTML 页面混合、根据在下拉列表框中选择的内容,决定页面效果,用户在下拉列表框中选择页面将要使用的背景颜色
程序员文章站
2022-04-10 09:01:41
查看本章节查看作业目录需求说明:根据在下拉列表框中选择的内容,决定页面效果用户在下拉列表框中选择页面将 要使用的背景颜色当用户选择橙色时,页面背景将显示为橙色实现思路:用表单
查看本章节
查看作业目录
需求说明:
根据在下拉列表框中选择的内容,决定页面效果
用户在下拉列表框中选择页面将 要使用的背景颜色
当用户选择橙色时,页面背景将显示为橙色
实现思路:
- 用表单 <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>
本文地址:https://blog.csdn.net/weixin_44893902/article/details/109336875