优化Java脚本代码

Question

我有这个JavaScript代码来添加和删除一些类。下面是代码。有人可以帮我优化这段代码吗？

  $(".showTR").click(function () {
    if (!$(this).parent().parent('tr').next('tr').hasClass('Row')) {
        if (!$(this).parent().parent('tr').next('tr').next('tr').hasClass('Row')) {
            if (!$(this).parent().parent('tr').next('tr').next('tr').next('tr').hasClass('Row')) {
                if (!$(this).parent().parent('tr').next('tr').next('tr').next('tr').next('tr').hasClass('Row')) {
                    if (!$(this).parent().parent('tr').next('tr').next('tr').next('tr').next('tr').next('tr').hasClass('Row')) {
                        if (!$(this).parent().parent('tr').next('tr').next('tr').next('tr').next('tr').next('tr').next('tr').hasClass('Row')) {

                        } else {
                            $(this).parent().parent('tr').next('tr').next('tr').next('tr').next('tr').next('tr').next('tr').removeClass('Row')
                            $(this).hide();
                        }
                    }
                    else {
                        $(this).parent().parent('tr').next('tr').next('tr').next('tr').next('tr').next('tr').removeClass('Row');
                    }
                } else {
                    $(this).parent().parent('tr').next('tr').next('tr').next('tr').next('tr').removeClass('Row');
                }

            } else {
                $(this).parent().parent('tr').next('tr').next('tr').next('tr').removeClass('Row');
            }
        } else {
            $(this).parent().parent('tr').next('tr').next('tr').removeClass('Row');
        }
    }
    else {
        $(this).parent().parent('tr').next('tr').removeClass('Row');          
    }

});

代码尝试检测下一个tr表是否具有类Row的表。如果没有，则转到下一个tr，如果是，则从下一个Row移除类tr，然后转到下一个tr，依此类推......

Answer 1

由于HTML代码不可用，您可以尝试以下方法：

方法1

• 导航到父tr，为此您可以使用.closest('tr')或.parents('tr')
• 现在使用tr
获取所有下一个.nextAll('tr')的列表
• 循环遍历它们并检查每个值。如果它有类，则删除它并更新标志以不影响其他trs。
• 如果是上次tr，也请隐藏.showTR

$(".showTR").click(function() {
  var self = this;
  var hasUpdated = false;
  var trs = $(this).parents('tr').nextAll("tr");
  $.each(trs, function(i, tr) {
    if (!hasUpdated) {
      var $tr = $(tr);
      hasUpdated = $tr.hasClass('Row') && $tr.removeClass('Row') && true;
      if (i === trs.length - 1) {
        $(self).hide()
      }
    }
  })
});

方法2

• 获取第一个兄弟tr给有“行”类的父tr。
• 从中删除课程。
• 如果是最后一个孩子，请隐藏.showTR

$(".showTR").click(function() {
  var tr = $(this).parents('tr').next("tr.Row:first");
  if(tr.length){
    tr.removeClass("Row");
    if(tr.is(':last-child'))
      $(this).hide()
  }
});