如何在组合框中添加一些图像作为下拉列表？

<select id="mySelect">
</select>

var select = document.getElementById("mySelect");

// 创建选项1
var option1 = document.createElement("option");
option1.value = "option1";
option1.innerHTML = "选项1";
var image1 = document.createElement("img");
image1.src = "image1.jpg"; // 图像资源地址
option1.prepend(image1);

// 创建选项2
var option2 = document.createElement("option");
option2.value = "option2";
option2.innerHTML = "选项2";
var image2 = document.createElement("img");
image2.src = "image2.jpg"; // 图像资源地址
option2.prepend(image2);

// 将选项添加到组合框中
select.appendChild(option1);
select.appendChild(option2);

/* 设置图像样式 */
img {
  width: 20px;
  height: 20px;
}

/* 设置下拉列表宽度 */
#mySelect {
  width: 200px;
}

// 添加点击事件
select.addEventListener("change", function() {
  var selectedValue = select.value;
  console.log("选中的值：" + selectedValue);
});