如何为 DOM 中的每个元素添加不同的文本
Posted
技术标签:
【中文标题】如何为 DOM 中的每个元素添加不同的文本【英文标题】:How to add diferent text for each element in DOM 【发布时间】:2017-12-22 23:08:10 【问题描述】:谁能告诉我这段代码有什么问题。我想添加一个从 0 到 4 的数字,但它只添加了循环中的最后一个数字。 非常感谢您。
<script>
for (i = 0; i < 5; i++)
var createEl = i;
var createEl = document.createElement("li");
for (j = 0; j < 5; j++)
createEl.innerhtml = [j];
console.log(createEl);
//<li>4</li>
//<li>4</li>
//<li>4</li>
//<li>4</li>
//<li>4</li>
【问题讨论】:
【参考方案1】:您不需要嵌套的 for 循环,只需使用第一个循环中的 i 值
for (i = 0; i < 5; i++)
var createEl = document.createElement("li");
createEl.innerHTML = i;
console.log(createEl);
这只会将标签打印到控制台。如果您想将它们放在另一个标签中,请像这样使用它:
var node = document.createElement("div");
for (i = 0; i < 5; i++)
var createEl = document.createElement("li");
createEl.innerHTML = i;
node.appendChild(createEl);
【讨论】:
【参考方案2】:你不需要两个循环。
var ulContainer = document.createElement("ul");
for (i=0; i < 5; i++)
var createEl = document.createElement("li");
createEl.innerHTML = i;
ulContainer.appendChild(createEl);
【讨论】:
以上是关于如何为 DOM 中的每个元素添加不同的文本的主要内容,如果未能解决你的问题,请参考以下文章