Javascript 同一类的多个div的CSS值不同/增加

我想使用javascript更改许多单独div的左边距值。关键在于：

我只想使用一个类名和

例如，我希望该类的每个实例的边距增加100px。这样，就不用让所有DIV彼此重叠，而是将每个DIV隔开：第一个位于左边距：0px，第二个位于左边距：100px，第三个位于左边距：200px，依此类推 下面是我的代码，它将相同的边距应用于所有div

<script>
    b = document.getElementsByClassName('spacing');
    for (i = 0; i < b.length; i++) {
    b[i].style.marginLeft = "100px";
    }
</script>

b=document.getElementsByClassName（'间距'）；
对于（i=0；i

---

有没有一种方法可以让javascript按顺序查找类的每个实例，而不是简单地将margin left:100px应用于all，它执行类似于（margin applicated to last instance of class+X）的操作，因此具有相同类名的100个div中的每一个都有一个唯一的marginLeft值

您要做的是通过循环的每次迭代跟踪您不断增加的利润：

b = document.getElementsByClassName('spacing');
var margin = 0;
for (i = 0; i < b.length; i++) {
   margin += 100;
   b[i].style.marginLeft = margin + "px";
}

b=document.getElementsByClassName（'spating'）；
var保证金=0；
对于（i=0；i

这应该能奏效

---

查看此处的一个工作示例：

是的，有一种方法可以简单地将裕量乘以迭代数，比如i*100+'px'而不是这个“100px”

var b=document.getElementsByClassName（'spating'）；
对于（i=0；i

---

如果所有

.spating

元素都嵌套。只要使用CSS的

.spating{padding left:100px}

，它们就会堆叠它们的填充。我同意。省略一个额外的变量来跟踪保证金是有意义的。但是由于

i

从

0

开始，它应该是

（i+1）*100+'px'

而不是

i*100+'px'

以符合描述“每个DIV将被空格隔开：第一个在左边距：0px，第二个在左边距：100px，左边第三个边距：200px'第一个元素的边距应该是0，这就是为什么我选择乘以迭代数而不是Itreation+1