JavaScript controls how a column of table is not displayed

This example demonstrates how JavaScript controls the non-display of a column of table. Share with you for your reference. The specific implementation method is as follows:

1. table code

<table id="mytable" border="0" width="1400" align="center"  

  cellpadding="3" cellspacing="1" bgcolor="#dfdfdf">

  <tbody id="tbody1" style="background: #e4e9f0; font-weight: bold;">

      <tr class="gray12">

          <td width="120" bgcolor="#FFFFFF"> The date of </td>

          <td width="120" bgcolor="#FFFFFF"> The name of the media </td>

          <td width="200" bgcolor="#FFFFFF"> Put in the form of </td>

          <td width="120" bgcolor="#FFFFFF"> The exposure number of times </td>

          <td width="120" bgcolor="#FFFFFF"> The number of light </td>

          <td width="120" bgcolor="#FFFFFF"> Click on the number of times </td>

          <td width="120" bgcolor="#FFFFFF"> Click on the number of </td>

          <td width="120" bgcolor="#FFFFFF">CTR</td>

          <td width="120" bgcolor="#FFFFFF"> Visit time </td>

          <td width="120" bgcolor="#FFFFFF"> Jump out of the number of </td>

          <td width="120" bgcolor="#FFFFFF"> Access to the depth </td>

          <td width="120" bgcolor="#FFFFFF"> Viewing hours / seconds </td>

          <td width="120" bgcolor="#FFFFFF"> Number of participants </td>

          <td width="120" bgcolor="#FFFFFF"> Number of persons handling business </td>

      </tr>

  </tbody>

  <tbody id="detail_id"></tbody>

</table>

2. js is controlled according to permissions

Note: if the data is dynamic, control the display of td after the assignment, otherwise the td header control will succeed and the other rows will fail

if (uname === "guest") {
 $("#mytable tr").each(function() {
   $(this).find("td").eq(7).css("display", "none");
   $(this).find("td").eq(8).css("display", "none");
   $(this).find("td").eq(9).css("display", "none");
   $(this).find("td").eq(10).css("display", "none");
   $(this).find("td").eq(11).css("display", "none");
   $(this).find("td").eq(12).css("display", "none");
   $(this).find("td").eq(13).css("display", "none");
 });
}

I hope this article is helpful for you to design javascript program.