Javascript 如何在jquery上创建执行事件的函数

我想知道我可以用什么方式在我的代码中实现一个函数，这样我就不必每时每刻重复它了

我的代码：

$（文档）.ready（函数（）{
//警报（“测试”）；
$（“#txt1”）.css（'display'，'none'）；
$（“#txt2”）.css（'display'，'none'）；
$（“#titu1”）。单击（功能（ev）{
$（“#txt1”）.slideToggle（'slow'）；
});
$（“#2”）。单击（功能（ev）{
$（“#txt2”）.slideToggle（'slow'）；
});
});
正文{
字体系列：“蒙特塞拉特”，无衬线；
}
.txtitucaracteristica{color:#be1521；}
.arrowBlack{color:#000；}



生活
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆


站立
loremloremloremloremloremloremloremloremloremloremlorem
使用类和
下一个
函数


$（文档）.ready（函数（）{
//警报（“测试”）；
$（.txtEachCaracteristica”）.css（'display'，'none'）；
$（“.txtitucaracteristica”）。单击（函数（ev）{
$（this.next（“.txtEachCaracteristica”）.slideToggle（'slow'）；
});
});
正文{
字体系列：“蒙特塞拉特”，无衬线；
}
特克斯提塔酒店{
颜色：#be1521；
}
阿罗布莱克先生{
颜色：#000；
}



生活
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆


站立
loremloremloremloremloremloremloremloremloremloremlorem
使用类和
下一个
函数


$（文档）.ready（函数（）{
//警报（“测试”）；
$（.txtEachCaracteristica”）.css（'display'，'none'）；
$（“.txtitucaracteristica”）。单击（函数（ev）{
$（this.next（“.txtEachCaracteristica”）.slideToggle（'slow'）；
});
});
正文{
字体系列：“蒙特塞拉特”，无衬线；
}
特克斯提塔酒店{
颜色：#be1521；
}
阿罗布莱克先生{
颜色：#000；
}



生活
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆


站立
LoremLoremLoremLoremLoremLoremLoremLoremLoremLorem
您可以使用类而不是Id

$(".txt").click(function(ev){
    $(this).slideToggle('slow');//here this will slide the currently clicked class
});


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" type="text/javascript"></script>
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous">

<br />

<div  class=" txt txtTituCaracteristica">
  <strong>Living</strong> <span class="arrowBlack"><i class="fas fa-angle-down"></i></span>
</div>
<div class="txt" class="txtEachCaracteristica">LoremLoremLoremLoremLoremLoremLoremLoremLorem</div>
<br>

<div class="txt xtTituCaracteristica"><strong>Stand</strong> <span class="arrowBlack"><i class="fas fa-angle-down"></i></span></div>
<div class="txt txtEachCaracteristica">LoremLoremLoremLoremLoremLoremLoremLoremLoremLorem 
</div>

$（“.txt”）。单击（函数（ev）{
$（this）.slideToggle（'slow'）；//这里将滑动当前单击的类
});


生活
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆


站立
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆
您可以使用类而不是Id

$(".txt").click(function(ev){
    $(this).slideToggle('slow');//here this will slide the currently clicked class
});


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" type="text/javascript"></script>
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous">

<br />

<div  class=" txt txtTituCaracteristica">
  <strong>Living</strong> <span class="arrowBlack"><i class="fas fa-angle-down"></i></span>
</div>
<div class="txt" class="txtEachCaracteristica">LoremLoremLoremLoremLoremLoremLoremLoremLorem</div>
<br>

<div class="txt xtTituCaracteristica"><strong>Stand</strong> <span class="arrowBlack"><i class="fas fa-angle-down"></i></span></div>
<div class="txt txtEachCaracteristica">LoremLoremLoremLoremLoremLoremLoremLoremLoremLorem 
</div>

$（“.txt”）。单击（函数（ev）{
$（this）.slideToggle（'slow'）；//这里将滑动当前单击的类
});


生活
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆


站立
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆
不，您不必一遍又一遍地重复自己，只需使用您已经拥有的类来触发该类中所有元素上的事件：


$（文档）.ready（函数（）{
//警报（“测试”）；
$（.txtEachCaracteristica”）.css（'display'，'none'）；
$（“.txtitucaracteristica”）。单击（函数（ev）{
设id=ev.target.id.substring（ev.target.id.length-1）；
$（“#txt”+id）.slideToggle（'slow'）；
});
});
正文{
字体系列：“蒙特塞拉特”，无衬线；
}
.txtitucaracteristica{color:#be1521；}
.arrowBlack{color:#000；}



生活
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆


站立
loremloremloremloremloremloremloremloremloremloremloremlorem
不，您不必一遍又一遍地重复自己，只需使用您已经拥有的类来触发该类的所有元素上的事件：


$（文档）.ready（函数（）{
//警报（“测试”）；
$（.txtEachCaracteristica”）.css（'display'，'none'）；
$（“.txtitucaracteristica”）。单击（函数（ev）{
设id=ev.target.id.substring（ev.target.id.length-1）；
$（“#txt”+id）.slideToggle（'slow'）；
});
});
正文{
字体系列：“蒙特塞拉特”，无衬线；
}
.txtitucaracteristica{color:#be1521；}
.arrowBlack{color:#000；}



生活
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆


站立
loremloremloremloremloremloremloremloremloremloremlorem
您可以使用CSS
[attribute^=value]
选择器。并在具有以
“titu”
开头的
id
属性值的所有元素上设置单击事件：


$（文档）.ready（函数（）{
//警报（“测试”）；
$（'div[id^=“txt”]）.css（'display'，'none'）；
$（'div[id^=“titu”]”）。单击（函数（）{
$（this）.next（'div'）.slideToggle（'slow'）；
});
});
正文{
字体系列：“蒙特塞拉特”，无衬线；
}
.txtitucaracteristica{color:#be1521；}
.arrowBlack{color:#000；}



生活
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆


站立
loremloremloremloremloremloremloremloremloremloremlorem
您可以使用CSS
[attribute^=value]
选择器。并在具有以
“titu”
开头的
id
属性值的所有元素上设置单击事件：


$（文档）.ready（函数（）{
//警报（“测试”）；
$（'div[id^=“txt”]）.css（'display'，'none'）；
$（'div[id^=“titu”]”）。单击（函数（）{
$（this）.next（'div'）.slideToggle（'slow'）；
});
});
正文{
字体系列：“蒙特塞拉特”，无衬线；
}
.txtitucaracteristica{color:#be1521；}
.arrowBlack{color:#000；}



生活
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆


站立
loremloremloremloremloremloremloremloremloremloremloremlorem
对所有顶级div（titu1、titu2等）使用另一个类
Ans请参阅下面对代码的修改-
HTML:
生活
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆


站立
洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆洛雷姆
CSS:
身体{
字体系列：“蒙特塞拉特”，无衬线；
}
txtituc先生