在表格中隱藏具有特定字符數的行

Question

我需要隱藏航班號超過 6 個字符（包括EY- ）的航班行，例如當頁面加載EY-5306的行時，應完全隱藏，只顯示航班號為EY-513的行.

<tr>
   <td>EY-5306</td>
   <td>29 Oct 2019</td>
   <td>07:00 am</td>
   <td>AUH</td>
   <td>AMM</td>
   <td>
      <a href="https://www.example.com?flightNumber=5306" role="link">Check flight status <img src="/images/test0.jpg" alt="image" class="check-flight-arrow"></a>
   </td>
</tr>

<tr>
   <td>EY-513</td>
   <td>29 Oct 2019</td>
   <td>10:35 am</td>
   <td>AUH</td>
   <td>AMM</td>
   <td>
      <a href="https://www.example.com?flightNumber=513" role="link">Check flight status <img src="/images/test1.jpg" alt="image" class="check-flight-arrow"></a>
   </td>
</tr>

當 JS 腳本運行時，我想查看該表，但排除了航班號為EY-5306的行，因為字符數超過 6 個。

Answer 1

使用.text().length; 獲取字符數。

 $('tr td:nth-child(1)').each(function(){ var value = $(this).text().length; if (value > 6){ $(this).parent().hide(); } });

 table{ width:100%; border:1px solid #ddd; } td{ border:1px solid #ddd; padding:10px; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table> <tbody> <tr><td>EY-5306</td><td>29 Oct 2019</td><td>07:00 am</td><td>AUH</td><td>AMM</td><td><a href="https://www.example.com?flightNumber=5306" role="link">Check flight status <img src="/images/test0.jpg" alt="image" class="check-flight-arrow"></a></td></tr> <tr><td>EY-513</td><td>29 Oct 2019</td><td>10:35 am</td><td>AUH</td><td>AMM</td><td><a href="https://www.example.com?flightNumber=513" role="link">Check flight status <img src="/images/test1.jpg" alt="image" class="check-flight-arrow"></a></td></tr> </tbody> <table>