JQuery controls several ways TR is hidden

  • 2020-03-30 03:22:01
  • OfStack

There are many on the Internet, here are three: the first method is to use id, this method can dynamically set the id of tr when generating HTML, is also the most used one of the simplest, as follows:


Then control implicit can be used directly

  for(var i = 1; i < tr_len; i++){ //Tr_len is the number of tr's you want to control

The second method is to use $.each(), which requires setting the id of the table as follows:


Then control implicit can be used directly

  $.each($("#Tbl tr"), function(i){   
     if(i > 0){    
        this.style.display = 'none';  

The third method is through the attribute filter, which requires adding a specific attribute to tr, such as class, as follows:


Then control implicit can be used directly

  var trs = $("tr[class='hid']");  
  for(i = 0; i < trs.length; i++){   
      trs[i].style.display = "none"; //The TRS [I] obtained here is a DOM object, not a jQuery object, so the hide() method cannot be used directly

It's that simple. If you want to display, change the method to show() or the display property to "".


Hide and display by id control as follows:

           var f_navState = $("input[name='f_navState']")[i].value;  //Gets the value of the marquee

Related articles: