一个Javascript中的多个For语句

希望能得到一些帮助，我是JavaScript新手，希望能在一次调用中使用for语句

function showIndividuals(param1, param2, param3, param4) {

  show_visibility(param1);
  hide_visibility(param2);

  var sCls = document.getElementsByClassName(param3);
  for (var i in sCls) {
    sCls[i].style.display = 'block';
  }


  var person = document.getElementsByClassName(param4);
  for (var i in person) {
    person[i].style.color = '#ccc';
  }

};

function hide_visibility(id) {
  var e = document.getElementById(id);
  e.style.display = 'none';
};

function show_visibility(id) {
  var e = document.getElementById(id);
  e.style.display = 'block';
};

我遇到的问题是，我不确定如何在一个JavaScript调用中运行多个for语句。希望有人能帮我理解怎么做，请。谢谢

******增加******

以下是一些HTML，将根据需要提供帮助

<div class="row">
<div class="col-sm-2"></div>
<div class="col-sm-5">
    <i class="fa fa-circle-o" aria-hidden="true"></i>&nbsp; Jane Johnson 
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <i class="fa fa-users blue" aria-hidden="true"></i>&nbsp; Executive Team (12)
</div>
<div class="col-sm-5 text-right">
    <div id="showindividuals"><a onclick="showIndividuals('hideindividuals','showindividuals','sigma-individuals','sigmabuttoncontainer-group')">Show Individuals</a></div>
    <div id="hideindividuals" style="display:none"><a onclick="">Hide Individuals</a></div>
</div>

<div class="col-sm-2">Header</div>
<div class="row col-sm-10">
    <div>
        <div>
            <button class="btn">A</button>
        </div>
    </div>
    <div>
        <div class="sigmabuttoncontainer-group">
            <i class="fa fa-users" aria-hidden="true"></i>
        </div>
    </div>
    <div class="sigma-individuals" style="display:none;">
        <div>
            1 - Stuff I want to show on click, there are multiple areas that use the same class within this page to show this information
        </div>
    </div>
</div>

  <div class="col-sm-2">Header 2</div>
<div class="row col-sm-10">
    <div>
        <div>
            <button class="btn">B</button>
        </div>
    </div>
    <div>
        <div class="sigmabuttoncontainer-group">
            <i class="fa fa-users" aria-hidden="true"></i>
        </div>
    </div>
    <div class="sigma-individuals" style="display:none;">
        <div>
            2 - Stuff I want to show on click, there are multiple areas that use the same class within this page to show this information
        </div>
    </div>
</div>

简·约翰逊
执行团队（12）
展示个人
隐藏个人
标题
A.
1-我想在单击时显示的内容，此页面中有多个区域使用同一类来显示此信息
标题2
B
2-我想在单击时显示的内容，在这个页面中有多个区域使用同一个类来显示这些信息

---

最大的问题是在主函数中有多个

return

语句。当遇到

return

语句时，当前运行的函数将向调用者（首先调用函数的代码）返回编程控制以及您可能指定的任何返回值。在主函数中，第一次

返回

之后的任何内容都将永远无法到达，甚至不需要

sCIs

的返回值。简言之，该函数不需要返回

return

另外，您正在使用

for/in

循环，这意味着迭代

对象

结构（其中有属性名和值），而不是数组。对于阵列，您可以使用一个

For

循环来计算其通过阵列的路径。对于真正的数组，您也可以使用内置的

.forEach（）

循环方法，但是，由于您在技术上没有真正的数组可以循环（您有HTML集合或“节点列表”，它们是“类似数组”的对象），因此不能使用它，因此计数的

for

循环是最合适的选择（除非您转换将“节点列表”转换为真数组（下一次的主题）

接下来，您将使用

getElementsByClassName（）

，这将起作用，但会返回一个“活动”节点列表，如果不在正确的位置使用，可能会降低性能。使用

querySelectorAll（）

执行效果更好，实现相同的结果，但实际上更灵活，因为它允许您传递任何有效的CSS选择器

这是一个正在运行的函数示例。请查看代码中的注释以了解发生的情况。请注意，硬编码CSS将

#group1

div

和所有

.param3

div

设置为初始隐藏。单击按钮（并执行函数）时，这些元素的显示将更改，最后一组元素的颜色也将更改

函数显示个人（参数1、参数2、参数3、参数4）{
//调用另外两个函数，并将此函数调用中的参数传递给它们
显示可视性（参数1）；
隐藏可见性（参数2）；
//获取具有“param3”类的所有元素的集合
var sCls=document.queryselectoral（param3）；
//在集合中循环（for/in循环用于对象而不是数组）
对于（变量i=0；i

/*启动id为：group1的div，以及隐藏类为.param3的所有div：*/
#group1、.param3{display:none；}

参数1元素
参数1元素
参数1元素
参数1元素
参数2元素
参数2元素
参数2元素
参数2元素
参数3元素
参数3元素
参数3元素
参数3元素
参数4元素
参数4元素
参数4元素
参数4元素
单击“我”

什么，问题和问题到底是什么？问题不在于第一个函数中的多个

for

语句。问题在于多个

return

语句。当到达第一个语句时，函数将终止，因此永远不会到达第二个循环。从我所知，hav中没有任何值在第一个函数中调用任何

return

语句。多个循环没有问题，但是多个

return

s将无法工作。您所说的“如何在一个JavaScript调用中运行多个for语句”是什么意思，因为在单个

showIndividuals

调用中有两个单独的for循环，但在第二个循环之前返回。它不会