Чому "aaa" залишається?

В прикладі нижче виклик table.remove() має видалити таблицю з документу.

Але, якщо ви запустите код, то побачите, що текст "aaa" не зникає.

Чому так відбувається?

<table id="table">
  aaa
  <tr>
    <td>Тест</td>
  </tr>
</table>

<script>
  alert(table); // таблиця, як і має бути

  table.remove();
  // чому текст "aaa" залишився в документі?
</script>

HTML в завданні написаний невірно. Це і є причиною дивної поведінки коду.

Браузер має виправити це автоматично. Але згідно специфікації тег <table> може містити в собі лише теги які відносяться до таблиць. Тому браузер виносить "aaa" перед тегом <table>.

Тепер очевидно, що коли ми видаляємо таблицю, текст залишається

Можна легко відповісти на це запитання, дослідивши DOM за допомогою інструментів веб-розробки в браузері. Ви побачите "aaa" перед <table>.

В стандартах HTML детально описано як обробляти некоректний HTML, тому така поведінка браузера є правильною.