jQuery-隱藏最后一個孩子 <td> 從 <table>

Question

如果業余愛好沒有價值（空），我想隱藏。 但是，如果業余愛好仍然有價值，那么仍然會顯示出來。 如何調節呢？ 我嘗試使用jQuery。

 $("tr:last-child td:last-child").css("font-weight","bold") if($("tr:last-child td:last-child").length < 1){ $("tr:last-child").hide() } 

 table{ border: 1px solid blue; padding: 4px 8px; margin:4px 0 } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr> <td>Name</td> <td>John</td> </tr> <tr> <td>Hobby</td> <td>Sleeping</td> </tr> </table> <table> <tr> <td>Name</td> <td>Doe</td> </tr> <tr> <td>Hobby</td> <td></td> </tr> </table> 

Answer 1

如果td的.text（）為空白，則可以隱藏.parent（） tr 。

 $("tr:last-child td:last-child").each(function(index, td) { if($(td).text() === ""){ $(td).parent().hide(); } }); 

 table { border: 1px solid blue; padding: 4px 8px; margin:4px 0 } tr:last-child td:last-child { font-weight: bold; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr> <td>Name</td> <td>John</td> </tr> <tr> <td>Hobby</td> <td>Sleeping</td> </tr> </table> <table> <tr> <td>Name</td> <td>Doe</td> </tr> <tr> <td>Hobby</td> <td></td> </tr> </table> 

Answer 2

您需要使用text()來獲取td的文本

 $("tr:last-child td:last-child").each(function(index,element){ $(element).css("font-weight","bold"); }); $("tr:last-child td:last-child").each(function(index,element){ if($.trim($(element).text()).length == 0){ $(element).parent().hide(); } }); 

 table{ border: 1px solid blue; padding: 4px 8px; margin:4px 0 } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr> <td>Name</td> <td>John</td> </tr> <tr> <td>Hobby</td> <td>Sleeping</td> </tr> </table> <table> <tr> <td>Name</td> <td>Doe</td> </tr> <tr> <td>Hobby</td> <td></td> </tr> </table> 

Answer 3

改變這個：

if($("tr:last-child td:last-child").length < 1){
    $("tr:last-child").hide()
}

至：

if($("tr:last-child td:last-child").text().length < 1){
    $("tr:last-child").hide()
}