Delete table tr in HTML with JavaScript

Question

I have made a function in JavaScript which automatically adds a line to a table every minute. It works fine, except that I would like to delete the second line of the table (since the first line is used for headings) if there are more than 5 lines. I tried this code:

if(table.getElementsByTagName("tr").length > 5){
    table.getElementsByTagName("tr")[1].outerHTML = "";
}

The problem is that when executing the second line, I get an error message saying "unknown execution error". Why does it do that? Is there any way to get around it?

In case it's important, I'm using HTA.

Works fine for me (though the second row should be index 1). What browser gives this error? What is HTA? You should provide a full working demonstration of the issue. — user1106925
– user1106925, Commented Mar 8, 2016 at 15:56
Also, your headings should really go in a <thead> element and the rest in a <tbody>. Then you can simply do table.tBodies[0].rows[0] to get the row you want. — user1106925
– user1106925, Commented Mar 8, 2016 at 15:59
To delete the second row from your table, you can use table.deleteRow(1); — Zack Macomber
– Zack Macomber, Commented Mar 8, 2016 at 16:01

Munawir · Accepted Answer · 2016-03-08 16:02:49Z

1

You can get the number of rows by

var rowCount = document.getElementById("myTable").rows.length;

To delete

if(rowCount > 5) {
    document.getElementById("myTable").deleteRow(1);  //deletes second row
}

answered Mar 8, 2016 at 16:02

Munawir

3,3569 gold badges36 silver badges51 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Przemek · Accepted Answer · 2016-03-08 16:24:58Z

1

var table = document.getElementsByTagName('table')[0];
if (table.rows.length > 5) {
  table.deleteRow(1);
}

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

(View on Codepen).

table.rows returns a collection of all <tr> elements in a table. length is it's property, that returns count of those elements. See Table rows Collection at W3Schools.
The deleteRow method removes the row at the specified index of a table. See Table deleteRow() Method at W3Schools.

You can read more about table object in HTML DOM Table Object at W3Schools.

answered Mar 8, 2016 at 16:24

Przemek

4,0042 gold badges28 silver badges34 bronze badges

Collectives™ on Stack Overflow

Delete table tr in HTML with JavaScript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related