Wie die letzte Zelle der Tabelle wählen, die nicht null ist, mit JQuery

Question

ich mit folgenden Zeilen und Zellen einer Tabelle haben:

<table id='table1'> 
    <tr id='row1'> 
    <th>index</th> 
    <th>Product</th> 
    <th>Description</th> 
    </tr> 
    <tr id='row2' name='row'> 
    <td name='index'>1</td> 
    <td name='product'>Apples</td> 
    <td name='description'>fruits</td> 
    </tr> 
    <tr id='row3' name='row'> 
    <td name='index'>2</td> 
    <td name='product'>Bananas</td> 
    <td name='description'>fruits</td> 
    </tr> 
    <tr id='row4' name='row'> 
    <td name='index'>3</td> 
    <td name='product'>Carrots</td> 
    <td name='description'>vegetables</td> 
    </tr> 
    <tr id='row5' name='row'> 
    <td name='index'></td> 
    <td name='product'></td> 
    <td name='description'></td> 
    </tr> 
</table> 

ich den Wert für die letzte td mit name = 'Index auswählen müssen 'Das ist nicht null. Jeder hat eine Idee, wie das gemacht werden kann.

Answer 1

Verwenden Sie den folgenden Selektor:

$('td[name=index]:not(:empty):last') 

Answer 2

Für rein pädagogische Zwecke, hier ist eine jQuery-Version:

function getLastNonEmptyCell(tableSelector) { 
    //Find parent table by selector 
    var table = document.querySelector(tableSelector) 
    //Return null if we can't find the table 
    if(!table){ 
    return null; 
    } 
    var cells = table.querySelectorAll("td") 
    var lastNonEmptyCell = null; 
    //Iterate each cell in the table 
    //We can just overwrite lastNonEmptyCell since it's a synchronous operation and the return value will be the lowest item in the DOM 
    cells.forEach(function(cell) { 
    //!! is used so it's so if it is not null, undefined, "", 0, false 
    //This could be changed so it's just cell.innerText.trim() !== "" 
    if (!!cell.innerText) { 
     lastNonEmptyCell = cell; 
    } 
    }) 

    return lastNonEmptyCell; 
} 

var cell = getLastNonEmptyCell("#table1") 

bearbeiten

Wie @squint dies vorgeschlagen kann getan werden, viel succintly:

function lastNonEmptyCell(tableSelector) { 
    //Since we want the last cell that has content, we get the last-child where it's not empty. This returns the last row. 
    var row = document.querySelectorAll(tableSelector + " td:not(:empty):last-child") 
    //Just grabbing the last cell using the index 
    return row[row.length - 1] 
}