Как удалить option'ы с определёнными значениями?

Question

[eldgammel]

Как удалить из select все option, чей value равен 1, 2 или 3?

<select id="delete">
  <option value="1">1</option>
  <option value="1">1</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="2">2</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="3">3</option>
  <option value="3">3</option>
  <option value="3">3</option>
</select>

Answer 1

[eldgammel]

Сам нашел ответ

for(let i of document.querySelectorAll("select")) {
  for(let n of i.querySelectorAll("option")) {
    if(n.getAttribute("value") == 1) {
      n.remove();
    } else if(n.getAttribute("value") == 2) {
      n.remove(); 
    } else if(n.getAttribute("value") == 3) {
      n.remove();
    }
  }
}

Comments

[DevMan]

селекторы? не, не слышал.

Answer 2

[0xD34F]

Откуда и кого надо удалить:

const select = document.querySelector('вам виднее, что тут должно быть');
const values = [ '1', '2', '3' ];

Удаляем:

[...select].forEach(n => values.includes(n.value) && n.remove());

или

for (const n of select.querySelectorAll(values.map(n => `[value="${n}"]`))) {
  select.removeChild(n);
}

или

select.replaceChildren(...Array.prototype.filter.call(
  select,
  ((values, n) => !values.has(n.value)).bind(null, new Set(values))
));

или

Array.prototype.reduceRight.call(
  select.options,
  (_, n) => ~values.indexOf(n.value) && n.replaceWith(),
  null
);

или

select.innerHTML = Array
  .from(select.children)
  .filter(function(n) {
    return n.matches(this);
  }, `:not(${values.map(n => `[value="${n}"]`)})`)
  .map(n => n.outerHTML)
  .join('');

или

(function next(i, n = select.item(--i)) {
  if (n) {
    for (const v of values) {
      if (v === n.value) {
        n.outerHTML = '';
        break;
      }
    }
    next(i);
  }
})(select.length);

Answer 3

[OCTAGRAM]

Можно обходить всех children тега select. Обходить лучше с конца, ведь результат children — массивоподобная штука, обновляющаяся автоматом. Если мы идём в цикле по индексам вперёд и удаляем, то начинаем пропускать. Как вариант, идти вперёд, но после удаления индекс не инкрементировать. Или декрементировать, чтоб на следующей итерации инкремент вернул как было. Или заранее чем-нибудь вроде Array.prototype.slice.call превратить массивоподобный children в настоящий массив, и там уже с этим неживым снимком поработать.