有什么方法可以处理选项的索引？

Question

我想添加删除'option1'并使用jQuery在相同位置附加另一个选项：假设我的选择是：

<select id="selectBox" name="selectBox">
  <option value="option"> option1 </option>
  <option value="option2"> option2 </option>
  <option value="option3"> option3 </option>
  <option value="option4"> option4 </option>
</select>

删除并附加后，我想要类似的选项：

<select id="selectBox" name="selectBox">
  <option value="myoption"> myoption </option>
  <option value="option2"> option2 </option>
  <option value="option3"> option3 </option>
  <option value="option4"> option4 </option>
</select>

我的脚本是：

$("#selectBox option[value='option1']").remove();
$("#selectBox").append('<option value="myoption">myoption </option> ');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="selectBox" name="selectBox">
  <option value="option"> option1 </option>
  <option value="option2"> option2 </option>
  <option value="option3"> option3 </option>
  <option value="option4"> option4 </option>
</select>

就我而言，它可以删除该选项，但将其附加在最后一个位置。有什么方法可以使用索引吗？

Answer 1

[您可以从下面的代码中引用，这里我在底部动态删除和添加选项，但是您可以使用选项索引select.options[select.options.length] = new Option('New Element', '0');添加任何位置，只需将select.options.length替换为索引：