Как удалить конкретные дочерние элементы HTML на JavaScript?

Question

[Sveklovoz]

Есть таблица на HTML:

<tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
</tr>

Нужно удалить второй и третий дочерний элемент tr, т.е. конкретно в этом случае чтобы код стал таким:

<tr>
  <td>1</td>
  <td>4</td>
  <td>5</td>
</tr>

И так сразу же отображался в браузере после прогрузки страницы.

Как это сделать на чистом JS? Я пытаюсь так, но понятное дело, ничего не выходит:

function removal() {
var a = document.getElementsByTagName('tr');
a[1,2].remove();
};

document.addEventListener("DOMContentLoaded", removal);

или

function removal() {
return document.getElementsByTagName('tr')[1,2].remove();
};

document.addEventListener("DOMContentLoaded", removal);

Answer 1

[0xD34F]

const parent = document.querySelector('селектор элемента, из которого надо кого-то удалить');
const toRemove = [ 3, 1, 666, 2 ];


toRemove
  .map(n => parent.children[n])
  .filter(Boolean)
  .forEach(n => n.remove());

// или

toRemove
  .sort((a, b) => b - a)
  .forEach(n => parent.children[n]?.remove());

// или

[...parent.children].forEach((n, i) => toRemove.includes(i) && n.remove());

Comments

[Sveklovoz]

Как обойтись, если у элемента-родителя нету css-селектора?

[0xD34F]

Sveklovoz, давайте-ка уточним: нет, или вы не знаете, каким он должен быть? Как именно вы достучитесь до нужного элемента - это к делу не относится.

[Sveklovoz]

0xD34F, ваш код не работает.

https://jsfiddle.net/j80dmr7b/

[0xD34F]

Sveklovoz, врать нехорошо. Это не мой код. Нет у меня никаких getElementsByTagName (кстати, вы не знаете, что этот метод делает - разберитесь).

Всё работает.

[Алексей Ярков]

Sveklovoz, это у вас не работает ))
https://jsfiddle.net/yarkov_aleksei/k204pqsv/

[Sveklovoz]

Алексей Ярков, Спасибо, но почему код не работает без объявления?

<table>
</table>

[Алексей Ярков]

Sveklovoz, потому что без <table> он рендерится вот в это