Why does "aaa" remain?
In the example below, the call table.remove()
removes the table from the document.
But if you run it, you can see that the text "aaa"
is still visible.
Why does that happen?
<table id="table">
aaa
<tr>
<td>Test</td>
</tr>
</table>
<script>
alert(table); // the table, as it should be
table.remove();
// why there's still aaa in the document?
</script>
The HTML in the task is incorrect. That’s the reason of the odd thing.
The browser has to fix it automatically. But there may be no text inside the <table>
: according to the spec only table-specific tags are allowed. So the browser shows "aaa"
before the <table>
.
Now it’s obvious that when we remove the table, it remains.
The question can be easily answered by exploring the DOM using the browser tools. You’ll see "aaa"
before the <table>
.
The HTML standard specifies in detail how to process bad HTML, and such behavior of the browser is correct.