如何根据标签在 JavaScript 中的顺序更改标签的内部 HTML？
我对JavaScript相当陌生，我正在练习较小的项目。
我想做的是将一堆标签的内部HTML更改为它们的顺序。
让我解释一下。
我想从这里开始。
*Number <br>
*Number <br>
*Number
对此。
*1 <br>
*2 <br>
*3
纯粹从脚本中做到这一点。
这就是我现在所拥有的。
断续器
<p id="thisIsANumber">Number</p>
<p id="thisIsANumber">Number</p>
<p id="thisIsANumber">Number</p>
<button onclick="orderElements()">Order Elements</button>
脚本
function orderElements() {
var reference = document.getElementById('thisIsANumber');
for (var i = 0; i < 3; i++) {
reference[i].innerHTML = i;
}
}
尚方宝剑之说浏览 73回答 2
2回答
-
MMMHUHU
正如评论中提到的，你不能让多个东西使用相同的东西 - 你应该使用一个。idclass例如，这表示您有一个段落，而这种段落是“编号段落”：<p class="numbered-paragraph">现在，您可以选择具有该类的所有段落，循环访问它们并为每个段落指定一个数字。此示例代码是显式的，因此很清楚 - 有很多方法可以缩短：document.getElementById('numberGenerator') .addEventListener('click', function(e) { const paragraphs = document.querySelectorAll('.numbered-paragraph'); let i = 1; for (p of paragraphs) { p.innerText = 'paragraph number ' + (i++); } });<p class="numbered-paragraph">Number</p><p class="numbered-paragraph">Number</p><p class="numbered-paragraph">Number</p><button id="numberGenerator">Order Elements</button>注意 我还使用过带有匿名函数的 addEventListener，而不是具有命名函数的内联 onclick=。 -
哔哔one
这里的主要问题是您使用了 而不是 。这样做的问题是，an 用于标识一个元素，而 a 可用于标识多个元素。如果你想要的是编号的段落元素，而不是一个有序的列表，这应该可以解决问题：idclassidclassfunction orderElements() { var reference = document.getElementsByClassName("thisIsANumber"); for (var i = 0; i < 3; i++) { reference[i].innerHTML = i; }}<body> <p class="thisIsANumber">Number</p> <p class="thisIsANumber">Number</p> <p class="thisIsANumber">Number</p> <button onclick="orderElements()">Order Elements</button> </body>
随时随地看视频慕课网APP
相关分类
JavaScript