无法设置未定义的属性'marginLeft'

Question

首先，>>>FIDDLE HERE<<<

我在网页上添加了一系列div，并使用JavaScript来改变边距。

var inn = document.getElementsByClassName("line");
for (var i in inn) {
   inn[i].style.marginLeft=40+"px";
}

虽然它已经改变了我的边距，但在我的控制台中报告了错误：

Uncaught TypeError: Cannot set property 'marginLeft' of undefined 

因此我的其余代码无法执行。

你能帮我解决这个问题吗？谢谢！

Answer 1

查看循环迭代的属性：

0
1
2
3
4
length

A for...in loop遍历对象的所有可枚举属性。除非你真的打算这样做，否则你不应该将它用于类似数组的对象。

0到4工作，但length没有style属性，这就是您的错误所说的。

改为使用常规for循环：

for (var i = 0; i < inn.length; i++) {
    inn[i].style.marginLeft = 40 + "px";
}

Answer 2

不要用于... ...它更慢，更容易出错尝试这个：

var inn = document.getElementsByClassName("line");
var i=0;
for (i=0;i<inn.length;i++) {
   inn[i].style.marginLeft=40+"px";
}

下一个显示for ... in ...我认为它可能包含一些不是Elements的东西所以.style是未定义的。

for(i in inn){
  console.log(i);
}

Answer 3

另一个可行的解决方案是代替类名，尝试使用id。只有当你明确地不需要上课时 将此行更改为

var inn = document.getElementsByClassName("line");

到

var inn = document.getElementById("line");

并且肯定会在html文件中进行更改。