如何从输入中获取所有数据属性到Javascript中的数组中？

Question

我有一系列输入，如果用户输入，我需要生成一个自动数组，但是当我输入时，它会在数组中添加多个元素。

我需要这样的结果

["10", "20", "30", "40", "50"]

但是如果我再次输入，就会这样

["10", "20", "30", "40", "50", "40", "30", "30", "30", "20"]

键入时如何只添加一次？

 const $input = document.querySelectorAll("input") var items = []; $input.forEach(item => { item.addEventListener('input', () => { boxdata = item.getAttribute('data-valor') items.push(boxdata); console.log(items); }) }) 

 item 1: <input type="text" data-valor="10"> item 2: <input type="text" data-valor="20"> item 3: <input type="text" data-valor="30"> item 4: <input type="text" data-valor="40"> item 5: <input type="text" data-valor="50"> 

Answer 1

像这样尝试Set ：

 const $input = document.querySelectorAll("input") const items = new Set(); $input.forEach(item => { item.addEventListener('input', () => { boxdata = item.getAttribute('data-valor') items.add(boxdata); console.log([...items]); }) }) 

 item 1: <input type="text" data-valor="10"> item 2: <input type="text" data-valor="20"> item 3: <input type="text" data-valor="30"> item 4: <input type="text" data-valor="40"> item 5: <input type="text" data-valor="50">