在 for 循环中附加几个相同的元素答案

【问题标题】：Append several identical elements within a for loop在 for 循环中附加几个相同的元素
【发布时间】：2014-03-27 23:39:52
【问题描述】：

在特定页面上，此标记出现多次：

<li class= "PRICE">
<label>Total Value:</label>
<span>$2,581</span>
</li>

我想使用 Javascript 将其动态更改为：

<li class= "PRICE">
<a href="mailto:example@example.com">Additional Savings</a>
</li>

虽然我可以这样做一次，但我无法更改页面上此标记的所有实例，因为我不确定如何创建同一元素的多个实例：

var bottomSavings = document.getElementsByClassName("PRICE");
var newLink = document.createElement('a');
newLink.href = "mailto:example@example.com?";
newLink.innerHTML = "Additional Savings";
for (var i = i=0;i<bottomSavings.length;i++) {
    bottomSavings[i].removeChild(bottomSavings[i].children[0]);
    bottomSavings[i].removeChild(bottomSavings[i].children[0]);
    bottomSavings[i].appendChild(newLink);
};

由于只有一个“newLink”元素，它只能追加一次。如何制作多个并附加到每个？

【问题讨论】：

标签： javascript arrays dom for-loop

【解决方案1】：

您需要为每个项目创建一个newLink 元素。最简单的方法是将创建锚元素的代码也移动到循环中：

var bottomSavings = document.getElementsByClassName("PRICE");
for (var i = i=0;i<bottomSavings.length;i++) {
    var newLink = document.createElement('a');
    newLink.href = "mailto:example@example.com?";
    newLink.innerHTML = "Additional Savings";
    bottomSavings[i].removeChild(bottomSavings[i].children[0]);
    bottomSavings[i].removeChild(bottomSavings[i].children[0]);
    bottomSavings[i].appendChild(newLink);
};

【讨论】：