Question

if / else语句和其他相似代码的问题

嗨，目前我正在使用此代码调用 if / else语句，以便在单击不同的表时添加和/或删除类“.hide”。这段代码工作得很好，完全没问题。

示例1

$(document).ready(function() {
    $('#Year_Table').click(function() {
        if ($('#Month_Table').hasClass("hide")) {
            $('#Month_Table').removeClass('hide');
        } else {
            $('#Month_Table').addClass('hide');
            $('#Day_Table').addClass('hide');
        }
    });
});

但我想知道的是，无论如何还要缩短代码？但结果相同。添加或删除该类。

我前几天有另一个问题，一个人将我的 if / else语句缩短为以下代码。谢谢

示例2

$( document ).ready(function(){
    var games_month  = 0;
    var month_games  = "Games";

    $("#Games_Month").html(games_month);

    $('#January').click(function(){ 
        $('#Games_Month').html(function(_, html) {
        return html === month_games ? games_month : month_games;
     });
});

缩短的代码也能很好地工作，但是给了我一些问号。现在，我想知道的是：

1：这种类型的代码是什么缩短了？我的意思是，它叫什么？

我被告知它可能是回调函数。

2：与标准的if / else语句和缩短的代码有什么不同？

是一样的，只是清理干净了？或者有什么重要的区别吗？

第3：缩短代码的不同部分是什么意思？他们做了什么？

对我而言，它似乎只是另一种if / else语句？

4：有没有办法用类而不是变量来创建这样的代码？

我只想添加或删除“.hide”类，而不是更改变量，是否可以在此函数中添加和删除多个类？

5：是否有其他方法可以编写if / else语句或代码，从而得到相同的结果？

我非常擅长使用javascript和jQuery，但我正在努力学习。我感谢所有帮助，我能理解这一切，一切都将帮助我进一步深入了解我的编码知识。

非常感谢。

Answer 1

$(document).ready(function() {
  $('#Year_Table').click(function() {
    $('#Month_Table').toggleClass("hide");
    $('#Day_Table').toggleClass('hide');

  });
});

.hide {
  color: red
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id='Year_Table'>click me</span>

<span id='Month_Table'>Month_Table</span>

<span id='Day_Table'>Day_Table</span>

使用.toggleClass()

Answer 2

您可以使用toggleClass缩短示例1代码，如下所示：

$(document).ready(function() {
    $('#Year_Table').click(function() {
        $('#Month_Table').toggleClass('hide');
        $('#Day_Table').toggleClass('hide');
    });
});

在您的示例2中，您使用ternary operator而不是if / else语句，它使用三个操作数。

condition ? expr1 : expr2

是否可以缩短我的if / else语句？

if / else语句和其他相似代码的问题

2 个答案: