cómo mostrar / ocultar solo esos tr si los últimos 2 td tienen el mismo texto. En esta tabla, quiero ocultar el 3er tr y el 4th tr. tiene el mismo valor.
<table class="table table-zeroBorder sticky-table vrt_table" id="tabledata"> <thead > <th > </th> <th "> Alto STD </th> <th > Alto LXI </th> </thead> <tbody > <tr > <td >Wheel Covers</td> <td> Center Cap </td> <td > Full </td> </tr> <tr > <td >Body Coloured Bumpers</td> <td > - </td> <td > yes </td> </tr> <tr > <td>Body Coloured Outside Door Handles </td> <td > yes </td> <td > yes </td> </tr> <tr> <td >Body Side Molding</td> <td > - </td> <td > - </td> </tr> <tr > <td >High-Mounted Stop Lamp</td> <td > yes </td> <td > </td> </tr> </tbody> </table>Mi código jquery aquí. Este código jquery oculta todos los tr que tienen un valor '-'. en esta tabla, quiero ocultar el 3er tr y el 4th tr. tiene el mismo valor.
$("#tabledata tbody tr td:contains('" + '-' + "')").filter(function () { return $(this).text().trim() == '-'; }).parent().toggle();Necesitaría iterar todos los elementos <tr> , verificar el contenido <td> y alternar la visibilidad en consecuencia
$("#hide-rows").on("click", () => { $("#tabledata tbody tr").each((_, tr) => { // Wrap the <tr> in a jQuery object const $tr = $(tr) // get the last two <td> children const cells = $tr.find("td").slice(-2) // get all the unique values const values = new Set(cells.map((_, { textContent }) => textContent.trim()).get()) // Toggle the <tr> $tr.toggle(values.size === 1) // or without using a Set // $tr.toggle(cells.eq(0).text().trim() === cells.eq(1).text().trim()) }) }) <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table border="1" id="tabledata"> <thead > <th > </th> <th> Alto STD </th> <th > Alto LXI </th> </thead> <tbody > <tr > <td >Wheel Covers</td><td> Center Cap </td><td > Full </td></tr><tr > <td >Body Coloured Bumpers</td><td > - </td><td > yes </td></tr><tr > <td>Body Coloured Outside Door Handles </td><td > yes </td><td > yes </td></tr><tr> <td >Body Side Molding</td><td > - </td><td > - </td></tr><tr > <td >High-Mounted Stop Lamp</td><td > yes </td><td > </td></tr></tbody></table> <p><button id="hide-rows" type="button">Hide rows</button></p>