Javascript 将div文本转换为下拉列表，并且div文本是选中的选项

div的文本需要成为生成的select下拉列表的select选项。我成功地创建了下拉列表并替换了div，但是，用于设置所选选项的值没有变为选中

下面是如何获取div值以及如何创建下拉列表

<script type="text/javascript">

var d = document.getElementById("val_to_set");

 var rvalue = d.innerHTML;    //Getting the value of div

//The options of a dropdown are populated from another dropdown menu 

 var listOptions =  document.getElementById("dropdown");

 var newddown = '<select name="displayoption">'+listOptions.innerHTML+'</select>';

 //Replace the div with the created dropdown menu 

d.innerHTML = newddown;    //TARGET ELEMENT

</script> 

var d=document.getElementById（“val_to_set”）；
var rvalue=d.innerHTML//获取div的值
//下拉菜单的选项从另一个下拉菜单填充
var listOptions=document.getElementById（“下拉菜单”）；
var newddown=''+listOptions.innerHTML+''；
//用创建的下拉菜单替换div
d、 innerHTML=newddown//目标元素

我找到了这个链接，它解释了如何按值、文本或索引进行选择

[1]

当尝试获取新建下拉列表的选项时，我会得到“选项未定义”

新的下拉列表将不会选择给定的选项-我已经尝试了给定链接中的所有情况，包括添加以下行，然后用下拉列表替换div

var seeker = ">"+rvalue+"<";
newddown = newddown.replace(seeker, "selected"+seeker);

---

var seeker=“>”+rvalue+”下面是一个使用您的代码和一些示例选项的工作示例：


与替换文本不同，迭代选项并以编程方式选择正确的选项非常容易，这与您引用的文章一致。这也不太容易出错

var opts = d.childNodes[0].options;
for (var i = 0; i < opts.length; i++) {
    if (opts[i].value == rvalue) {
        opts[i].selected = true;
        break;
    }
}

var opts=d.childNodes[0]。选项；
对于（变量i=0；i

注意：
d
引用的是，而不是节点，这是因为您使用的是
innerHTML
请将您的标记包含在目标html中好吗？我编辑了内容以包含目标元素d.innerHTML=newddown；您得到的是“选择”的innerHTML（仅包含“选项”列表）。如果菜单应该像普通的“选择”对象一样可选择，那么您可能应该使用outerHTML，以便包含“选择”对象。感谢您的输入MikeAppr4！此子节点完成了以下操作：）
var opts = d.childNodes[0].options;
for (var i = 0; i < opts.length; i++) {
    if (opts[i].value == rvalue) {
        opts[i].selected = true;
        break;
    }
}