这个程序要怎么打出来各位！

图片切换：使用JavaScript编写如下图所示的页面，要求能够通过下拉列表进行图片的切换显示。注意：使用内部css和内部JavaScript。

img

select change事件 。获取 img 标签 给不同的 src就行 。

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

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <select name="picter" id="pic" onchange="picChange()">
    <option value="图片1">图片1</option>
    <option value="图片2">图片2</option>
  </select>
  <img src="https://img0.baidu.com/it/u=3077303766,3831456750&fm=253&fmt=auto&app=120&f=JPEG?w=889&h=50" alt="" id="img">
</body>
<script>

  function picChange(e) {
    let sel = document.getElementById("pic");
    let val = sel.value;
    let img = document.getElementById("img");

    if (val == "图片1") {
      img.src = "https://img0.baidu.com/it/u=3077303766,3831456750&fm=253&fmt=auto&app=120&f=JPEG?w=889&h=500";
    } else if (val == "图片2") {
      img.src = "https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fblog%2F202108%2F22%2F20210822103624_0c3ad.thumb.1000_0.jpg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1642735560&t=30162d1ccc1bee145fffabc57a5ced98"
    }
  }
</script>

</html>



<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1" />
    <meta name="renderer" content="webkit" />
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <title>示例</title>
  </head>
  <body>
    <select name="" id="select_box">
      <option value="1">图片1</option>
      <option value="2">图片2</option>
      <option value="3">图片3</option>
    </select>
    <img src="./src/assets/img/mao.jpg" alt="" width="200" class="img_box" />
    <script>
      const select = document.getElementById("select_box");
      const img = document.querySelector(".img_box");
      let imgList = [
        "./src/assets/img/mao.jpg",
        "./src/assets/img/user.png",
        "./src/assets/img/dark.png",
      ];//需要将图片地址改为自己对应的地址
      //监听select选中
      select.addEventListener("change", function () {
        imgList.forEach((item, index) => {
          let value = Number(this.value);//将option的value值转为数字；
          if (value - 1 === index) {//选中的项与索引对应
            img.src = item;
          }
        });
      });
    </script>
  </body>
</html>

下拉菜单 select