All geek questions in one place

Get the last row of a table attribute

var table = document.getElementById(table1); var lastRow = table.rows.length; var country = lastRow.getElementById('Country'); country.setAttribute('class', "Country"+lastRow);

Im pretty new and I was wondering if this is possible?

Instead

 var Country= document.getElementById('Country');

Since I have another id = Country, because I am adding new lines.

EDIT

I know that identifiers are unique. But I am cloning the last line, so of course the identifiers will be the same.

+4
source share
4 answers

The identifier in the HTML document is unique. Therefore, there is no need to make subqueries to find elements. Instead, always use document.getElementById('Country')

+1
source

The last row of the table can be obtained from the rows property.

 var lastRow = table.rows[ table.rows.length - 1 ];

However, I think there is some confusion as to what exactly you are asking.

+8
source

Here's how to implicitly get the last cell. Note that you can reference a specific object in an array of rows or cells using square bracket notation, and due to the indexing of arrays starting at 0, you must subtract 1 from the length to use it as the actual last index.

This example shows the cases you can do:

 <!DOCTYPE html> <html> <head> <title>Table test</title> <script language="javascript" type="text/javascript"> function init() { var table = document.getElementById("table1"); var lastRowIndex = table.rows.length-1; var lastCellIndex = table.rows[lastRowIndex].cells.length-1; alert( table.rows[lastRowIndex].cells[lastCellIndex].innerHTML ); // alerts the cell containing HTML, or 9 var lastCell = table.rows[lastRowIndex].cells[lastCellIndex]; // contains a reference to the last cell } window.onload = init; </script> </head> <body> <table id="table1"> <tr><td>1</td><td>2</td><td>3</td></tr> <tr><td>4</td><td>5</td><td>6</td></tr> <tr><td>7</td><td>8</td><td>9</td></tr> </table> </body> </html>

Suppose you had an arbitrary table with 8 columns and 4 rows, as in the following example, and demanded that the cell in column 5 and row 3 receive this cell, which you would like to get a link to the table (for example, via getElementById ), and then select for the right row and column through rows and cells to subtract 1 due to indexing arrays starting from 0. See this example:

 <!DOCTYPE html> <html> <head> <title>Table test</title> <script language="javascript" type="text/javascript"> function init() { var table = document.getElementById("table1"); var column5Row3 = table.rows[2].cells[4]; // contains a reference to the cell that is in the 3rd row, and 5th column alert( column5Row3.innerHTML ); // alerts that cell innerHTML (or Y) } window.onload = init; </script> </head> <body> <table id="table1"> <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr> <tr><td>2</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td></tr> <tr><td>3</td><td>x</td><td>x</td><td>x</td><td>Y</td><td>x</td><td>x</td><td>x</td></tr> <tr><td>4</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td></tr> </table> </body> </html>
+2
source

I think the best way to do this is:

 var lastTr = document.getElementById('tabRecapCommande').lastElementChild.lastElementChild;

with document.getElementById('tabRecapCommande') returns <table> document.getElementById('tabRecapCommande').lastElementChild . returning <tbody> document.getElementById('tabRecapCommande').lastElementChild.lastElementChild last <tr> <tbody>

if you console.log(lasTr) you will see your last <tr> element :)

+1
source

Source: https://habr.com/ru/post/1400284/

More articles:


All Articles