编程4-3，请老师检查
来源：4-3 编程练习
陈莺莺呀
2019-11-05 14:56:49
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demo</title>
<style>
body{
background: #eee;
}
</style>
</head>
<body>
<div>
<p>
请选择菜单：<select name="choose" id="choose">
<option value="水果" class='item'>水果</option>
<option value="蛋糕" class='item'>蛋糕</option>
<option value="坚果" class='item'>坚果</option>
</select>
</p>
<p>
<span>该系列有：</span>
<span class="res"></span>
</p>
</div>
</body>
<script>
//获取元素
//querySelector获取指定元素中的第一个元素
var choose=document.querySelector('#choose');
var res=document.querySelector('.res');
//绑定事件
choose.onchange=function(){
switch(this.value){
case '水果':
res1();
break;
case '蛋糕':
res2();
break;
case '坚果':
res3();
break;
}
}
function res1(){
res.innerHTML='苹果、香蕉';
}
function res2(){
res.innerHTML='慕斯、奶酪';
}
function res3(){
res.innerHTML='碧根果、巴旦木';
}
</script>
</html>
1回答
-
同学你好，为了提示用户体验，建议：第一项为“请选择”。如下修改
其他地方实现的不错，继续加油，祝学习愉快~
0
相似问题