如何优化Javascript函数

我想在悬停不同div的子元素时，在div子元素上制作动画这是我的代码：

$（'.li节：第n个子项（1）'）。悬停（函数（）{
$（'.Section2Li:nth child（1'））.toggleClass（'is-over'）；
});
$（'.li节：第n个子项（2）'）。悬停（函数（）{
$（'.Section2Li:nth child（2'））.toggleClass（'is-over'）；
});
$（'.li节：第n个子项（3）'）。悬停（函数（）{
$（'.Section2Li:nth child（3）'）。toggleClass（'is-over'）；
});
$（'.li节：第n个子项（4）'）。悬停（函数（）{
$（'.Section2Li:nth child（4）'）。toggleClass（'is-over'）；
});这是一个广泛的问题

您可以创建这样的函数

function hoverChild(child){
  $('.section li:nth-child('+child+')').hover(function(){
            $('.section2 li:nth-child('+child+')').toggleClass('is-over');
        });
}

根据需要，将此函数调用为

hoverChild(n) where n =1,2,3....

这是一个广泛的问题

您可以创建这样的函数

function hoverChild(child){
  $('.section li:nth-child('+child+')').hover(function(){
            $('.section2 li:nth-child('+child+')').toggleClass('is-over');
        });
}

根据需要，将此函数调用为

hoverChild(n) where n =1,2,3....

您可以使用
$（this）.index（）
获取悬停的
项的索引


$（'.section li'）。悬停（函数（）{
var index=$（this.index（）+1；
$（'.Section2Li:n子项（'+index+'））.toggleClass（'is-over'）；
});
。结束了{
颜色：红色；
}


第一步
步骤2


步骤11
步骤22
您可以使用
$（this）.index（）
获取悬停的
项目的索引


$（'.section li'）。悬停（函数（）{
var index=$（this.index（）+1；
$（'.Section2Li:n子项（'+index+'））.toggleClass（'is-over'）；
});
。结束了{
颜色：红色；
}


第一步
步骤2


步骤11
步骤22
CodeReview可能是解决此类问题的更好的网络。优化什么？CodeReview可能是解决此类问题的更好的网络。优化什么？