4-3 编程练习作业提交

来源：4-3 编程练习

MiMicccc

2021-04-09 17:11:32

<!DOCTYPE html>
<html lang="en">

<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.querySelector('#menu');
        var span = document.getElementsByTagName('span')[0];

        menu.onchange = function () {
            switch (menu.value) {
                case 'fruit':
                    span.innerHTML = '西瓜 哈密瓜 苹果 香蕉';
                    break;
                case 'cake':
                    span.innerHTML = '蛋糕 蛋糕 蛋糕 蛋糕';
                    break;
                case 'nuts':
                    span.innerHTML = '坚果 坚果 坚果 坚果';
                    break;
                default:
                    span.innerHTML = '';
            }
        }
    </script>
</body>

</html>