jQuery将许多选项添加到选择列表中

我正在尝试使用jQuery向select添加大约500个选项。 它运行500次循环

for( var i=0; i<ids.length;i++ ){
  $("#selectId').append('<option value="' + value + '">' + label + '</option>');
}

在Mozilla Firefox等浏览器中，它工作正常大约需要3秒钟，但在Goggle Chrome中，浏览器在半分钟后崩溃

我放了一些日志来看看它需要多少时间，它从每个循环1ms开始，然后增加到~1s

---

有什么建议可以提高它的效率吗？

我发现您的循环存在两个性能问题：

在每次迭代中，您将创建一个新的jQuery对象，并在DOM中搜索selectId 在每次迭代中，您都在操作DOM，添加一行。 这两种方法都会影响性能。尝试：

var options = [];
for (var i = 0; i < ids.length; i++) {
  // first, populate an array with all the options as strings
  options.push('<option value="' + value + '">' + label + '</option>');
}
// then, join that array into a string and just .append or .html
$('#selectId').append(options.join(''));
// OR
$('#selectId').html(options.join(''));

---

您真的需要在一个下拉列表中包含500个选项吗？无论如何，您最好在for循环中连接一个字符串，然后在循环完成后将其附加到select元素，或者使用HTML fragmentSearch工具？我无法在下拉列表中构思出需要500个选项的概念。您是否愿意使用不同的界面？将选项构建为字符串，最好是先推到数组，然后.join，然后使用$'selectId'.htmloptions，或document.getElementById'selectId'.innerHTML=选项此处使用文档片段，例如：它在Firefox和Chrome中都适用于我。无论如何，您的示例$selectId'中的引号有一个错误。