Javascript 尝试引用div中没有id的标头

我实际上是在创建一个外观简单的进度条。我有4个部分，每个部分上面都有进度条。例如，在第2节中，此步骤的进度条将以绿色突出显示步骤1。对于第3节，进度条将以绿色等突出显示步骤1和2

类步骤未完成与步骤完成相同，只是背景不同

目前，我有几个问题。我无法找到如何引用每个div中的标题。无论我做什么，我都不会得到任何东西或[object HTMLHeadingElement]。循环本身很好，但我找不到一种方法来更改特定div中特定头的类名

代码如下：

.步骤完成{
显示：内联；
边框样式：隐藏；
背景：绿色；
}
.步骤不完整{
显示：内联；
边框样式：隐藏；
背景：无；
}
var Numof=4；
函数changeColour（）{
对于（i=1；i=1；j--）{
警惕（j）；
var header=document.getElementsByName（“步骤-”+j）；
警报（progress.header.className）；
}
}
}
}
window.onload=函数（）{
变色（）；
};
点击我
步骤1
步骤二
步骤三
步骤四
校长1
。。。。。。。。。。。。。。。。。。































步骤1
步骤二
步骤三
步骤四
校长2
。。。。。。。。。。。。。。。。。。































步骤1
步骤二
步骤三
步骤四
校长3
。。。。。。。。。。。。。。。。。。































步骤1
步骤二
步骤三
步骤四
校长4
。。。。。。。。。。。。。。。。。。

对我来说，我想你就快到了！但是我确信，使用

getElementsByName（）

，您必须提供一个索引，类似于

getElementsByTagName（）

或

getElementsByClass（）

，因此-

var header=document.getElementsByName（“步骤-”+j）

我想应该是这样

var header=document.getElementsByName（“步骤-”+j）[0]

---

如果我理解了这个问题，那么在

[0]

末尾添加索引后，您遇到的问题似乎是

文档。getElementsByName（）

将返回页面上具有给定名称的所有元素，而不管它们实际位于哪个div中

您可以尝试迭代每个进度div的子级：

function changeColour() {
    for(i=1; i<=numOfSections; i++){
        if(i != 1){
            alert(i);
            var progress = document.getElementById('progress-' + i).id;
            alert(progress);
            for(j=0; j<progress.children.length; j++){
                alert(j);
                var segment = progress.children[j];
                alert(segment.className);
            }
        }
    }
}

函数changeColour（）{
对于（i=1；i您应该使用
querySelector
，这样您就可以将搜索包含到您正在循环的div中

function changeColour() {
  for (var i = 1; i <= numOfSections; i++) {
    if (i != 1) {
      alert(i);
      var progress = document.getElementById('progress-' + i).id;
      alert(progress);
      for (var j = i - 1; j >= 1; j--) {
        // Instead of querying the whole document, query just the current div
        var header = progress.querySelector("h1[step-" + j + "]");
        alert(progress.header.className);


      }
    }
  }
}

您可以尝试在中重新创建问题吗？也许您应该描述您正在尝试完成的任务。目前您所拥有的没有多大意义。您在
h1
标记中有name属性，这在HTML中是不允许的。您多次使用相同的名称，因此您的
getElementsByName（）
将返回多个结果。变量
progress
中存储的数字肯定没有
header
属性。也就是说，假设他在html中有一个标题的名称。这应该完全不同。你总是只会得到第一项，而不是特定divI person下的第一项ally会同意，这只是我注意到的第一个/最大的问题-而且，如果我诚实的话，我可能不会看到其他的=）
  var h1s = progress.querySelectorAll('h1');