Question

假设我有一个HTML select对象，其中没有任何内容。

<select id="options">
</select>

是否可以将JavaScript数组附加到此选择项，以便在更新数组时，选择项中的可用选项也可以？

或者我仅需使用JQuery即可实现所需的功能。

Answer 1

任何使用虚拟DOM（Angular，Vue.js，React ...）的JavaScript框架都将使其比jQuery或Vanilla JavaScript更加容易（且速度更快）。也就是说，框架不能彼此共存，并且很难与jQuery之类的库共存；我建议决策不仅要基于像这样的问题，而且可以在没有任何问题的情况下解决。

这里是Vue；我使用过的最关键的框架：

new Vue({
  el: '#options',
  data: {
    array: [
      'option 1',
      'option 2',
      'i lost count'
    ]
  }
})

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<select id="options">
  <option v-for="value in array">
    {{ value }}
  </option >
</select>

Answer 2

如果阵列已更新，则可以使函数每次运行。 jQuery没有像 ~~arrayChanged~~ 这样的方法。更改阵列后初始化功能手册。

function updateSelect(arr) {

    // code with jQuery each or clean JS

}


// code to change array
var arr = ...


// run select updater
updateSelect(arr);

我可以将HTML select与动态数组关联吗？

2 个答案: