4-3 请老师检查
来源:4-3 编程练习
慕妹6205103
2020-07-09 10:58:40
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<p>
请选择菜单:
<select id="menu">
<option>请选择</option>
<option value="fruit">水果</option>
<option value="cake">蛋糕</option>
<option value="nuts">坚果</option>
</select>
</p>
<p>该系列有:<span></span></p>
<script>
var menu = document.getElementById('menu');
var options = menu.getElementsByTagName('option');
var span = document.getElementsByTagName('span')[0];
for (var i = 1; i < options.length; i++) {
menu.onclick = function () {
switch(this.value){
case 'fruit':
span.innerHTML = '苹果、香蕉';
break;
case 'cake':
span.innerHTML = '慕斯、奶酪';
break;
case 'nuts':
span.innerHTML = '碧根果、巴旦木';
break;
}
}
}
</script>
</body>
</html>
1回答
好帮手慕言
2020-07-09
同学你好,这样也是可以实现效果的,建议优化:改成onchange事件,性能会更好,如下:
外层的for循环建议去掉,代码会更简洁。祝学习愉快~
相似问题