javascript 将选项元素添加到选择列表，但具有自定义数据属性

Question

我正在尝试向列表中插入一个附加的选择选项，但具有特定的数据元素:

function myFunction() {
    var x = document.getElementById("mySelectList");
    var option = document.createElement('option', {
        "data-img-src": "https://blah",
        "data-img-alt": "https://blah"
    });
    option.text = "New Image";
    x.add(option);
}

这是为了允许图像选择器检测附加项目并希望显示它。

但是附加属性将被忽略。 我真的很感谢您的帮助，因为我快疯了。谢谢

Answer 1

我想补充一点，x.add 无效，请使用 appendChild 代替: Node.appendChild

总结:

function myFunction() {
  var x = document.getElementById("mySelectList");
  var option = document.createElement('option');
  option.text = "New Image";
  option.setAttribute("data-img-src", "https://blah");
  option.setAttribute("data-img-alt", "https://blah");
  x.appendChild(option);
}