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事件,性能会更好,如下:

http://img.mukewang.com/climg/5f068af20970dcf704730074.jpg

外层的for循环建议去掉,代码会更简洁。祝学习愉快~

0

0 学习 · 14456 问题

查看课程

相似问题