如何从列表中的选择元素获取所有选项

Question

使用jquery（或本机js）。如何在列表中获取所有选项html，因此输出类似于：

var options = ['<option value="" selected="">---------</option>', <option value="1">Option 1</option>']

Answer 1

您可以获取select节点并查找select节点中的所有选项，并从这些选项中获取html。

var selectNode = $('select-selector');
var options = selectNode.find('option').toArray().map(function (o) { return o.outerHTML});

根据Rory的评论建议进行修改。

$.map(selectNode.find('option'), function(o) { return o.outerHTML; });

Answer 2

这样的东西？

var selectBoxEl = document.getElementById('selectBox');
var arrayOfNodes = selectBoxEl.childNodes;
var optionsArr = [];
// loop through child Nodes and only get option nodes
for (var i = 0; i < arrayOfNodes.length; i++) {
	if (arrayOfNodes[i].nodeName === 'OPTION') {
  	optionsArr.push(arrayOfNodes[i].outerHTML);
  }
}

console.log(optionsArr);

<select id="selectBox">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>