javascript - 优化 jQuery 代码的重复和平

Question

我是 js 和 jQuery 的新手，我写了一些我认为可以优化的代码。这是我所拥有的：

$(".team-member.personX").click(function(){
    $(this).children(".img-mask").attr("src", "images/img-mask-active.png");
    $(".member-info.personX").fadeIn();
});
$(".member-info.personX .close").click(function(){
    $(".team-member.personX .img-mask").attr("src", "images/img-mask.png");
    $(".member-info.personX").fadeOut();
});

主要是我想问有没有一种方法可以用1,2,3,4替换-- X --而不会重复相同的代码 4 次。任何帮助将不胜感激。

Answer 1

它一般是关于 Javascript，而不是专门的 jQuery。

实际上，循环的经典示例。您可以使用 for 循环：

for(i = 1; i <= 4; i++)
{
    //actions utilizing i taking values from 1 to 4
}

...以及字符串可以很容易地与数字结合使用的事实+：

$(".member-info.person" + i).fadeIn(); //an example action

Answer 2

好的，我想通了。我发现优化代码的最简单方法是使用函数调用。

例子：

function on(x){...}
$(person1).click(function{ on(1) }) and e.t.c.

这不是最好的解决方案，但它很简单而且很有效。