如何更改标记'；根据它们在JavaScript中的顺序创建内部HTML？

我对JavaScript相当陌生，我正在练习一些较小的项目

我想做的是将一组标记的内部HTML更改为它们的顺序

让我解释一下

我想从这开始

*Number <br>
*Number <br>
*Number

*编号

*数字

*数

对这个

*1 <br>
*2 <br>
*3

*1

*2

*3

完全从JavaScript执行

这就是我现在拥有的

HTML

编号

编号

编号

有序元素 JavaScript

function orderElements() {
  var reference = document.getElementById('thisIsANumber');
  for (var i = 0; i < 3; i++) {
    reference[i].innerHTML = i;
  }
}

函数orderElements（）{
var reference=document.getElementById（'ThisisNumber'）；
对于（变量i=0；i<3；i++）{
参考[i].innerHTML=i；
}
}

这里的主要问题是您使用了

id

而不是

类

。问题在于

id

用于标识一个元素，而

class

可用于标识多个元素。如果您想要的是带编号的段落元素，而不是有序列表，那么应该这样做：

函数orderElements（）{
var reference=document.getElementsByClassName（“ThisisNumber”）；
对于（变量i=0；i<3；i++）{
参考[i].innerHTML=i；
}
}

编号

编号

编号

有序元素

如评论中所述，您不能有多个东西使用相同的

id

-您应该使用

类

例如，这表示您有一个段落，这种段落是“编号段落”：

现在，您可以选择所有具有该类的段落，在其上循环并为每个段落指定一个数字

此示例代码是显式的，因此非常清楚-有许多方法可以缩短此过程：

document.getElementById（'numberGenerator'）
.addEventListener（'click'，函数（e）{
const段落=document.queryselectoral（“.编号段落”）；
设i=1；
第（p）段{
p、 innerText='段落编号'+（i++）；
}
});
编号

编号

编号

订单元素

错误代码=>id必须唯一您的第一个示例显示

（换行）元素，但您的第二个示例使用

（段落）元素。它们是不同的东西。请注意，

是一个无内容的自动关闭元素，而

有内容。此外，在设置人类可读的文本内容时，您应该使用

.textContent

而不是

.innerHTML

。来进一步解释Jojo先生的评论-您的

文档.getElementById（'ThisisNumber'））

只获取一个元素，因为

id

在页面中必须是唯一的。如果您计划有多个相同类型的项目，您想要使用的是一个class

class=“ThisisNumber”

对不起，我从来没有打算让标签出现。我使用它们将点显示为列表，因为默认情况下，它们显示在同一行上。感谢您的简单解释和解决方案！

function orderElements() {
  var reference = document.getElementById('thisIsANumber');
  for (var i = 0; i < 3; i++) {
    reference[i].innerHTML = i;
  }
}