嵌套循环中的未定义变量

时间:2013-07-30 16:45:01

标签: javascript variables undefined nested-loops

我有一系列嵌套循环来控制文档中一系列选项卡的布局。

var k=0;
while(k<document.getElementsByTagName("h7").length){
  for(i=0;i<5;i++){
    document.getElementsByTagName("h2")[k].style.left=i*154+"px";
    document.getElementsByTagName("h7")[k].style.left=i*154+"px";
    if(i==0){
        document.getElementsByTagName("h2")[k].style.left="42px";
        document.getElementsByTagName("h7")[k].style.left="42px";
    }
    k++;
  }
}

它在浏览器控制台中有效,但出现错误,指出document.getElementsByTagName("h2")[k].style.left=i*154+"px";未定义。我假设我的k变量范围有问题。谁能帮我?我尝试了各种各样的事情,包括传递参数k而不是使用变量,但似乎没有解决问题。

这是一个小提琴http://jsfiddle.net/zbpzu/

以下是HTML示例

<h2>Header 2-1</h2>
<h7>header 7-1</h7>

<h2>Header 2-2</h2>
<h7>header 7-2</h7>

<h2>Header 2-3</h2>
<h7>header 7-3</h7>

<h2>Header 2-4</h2>
<h7>header 7-4</h7>

<h2>Header 2-5</h2>
<h7>header 7-5</h7>

<h2>Header 2-6</h2>
<h7>header 7-6</h7>

<h2>Header 2-7</h2>
<h7>header 7-7</h7>

<h2>Header 2-8</h2>
<h7>header 7-8</h7>

<h2>Header 2-9</h2>
<h7>header 7-9</h7>

<h2>Header 2-10</h2>
<h7>header 7-10</h7>

<h2>Header 2-11</h2>
<h7>header 7-11</h7>

<h2>Header 2-12</h2>
<h7>header 7-12</h7>

<h2>Header 2-13</h2>
<h7>header 7-13</h7>

谢谢!

2 个答案:

答案 0 :(得分:0)

我建议k使用for循环,就像i

一样
var h7length=document.getElementsByTagName("h7").length;
for(k=0;k<h7length;k++){
  for(i=0;i<5;i++){
    if(i==0){
        document.getElementsByTagName("h2")[k].style.left="42px";
        document.getElementsByTagName("h7")[k].style.left="42px";
    }
    else
    {
    document.getElementsByTagName("h2")[k].style.left=i*154+"px";
    document.getElementsByTagName("h7")[k].style.left=i*154+"px";
    }
  }
}

答案 1 :(得分:0)

感谢Crazy Train指出问题......这是解决方法!

for(k=0;k<document.getElementsByTagName("h7").length;){
for(var i=0;i<5;i++){
  if(k<document.getElementsByTagName("h7").length){
    document.getElementsByTagName("h2")[k].style.left=i*154+"px";
    document.getElementsByTagName("h7")[k].style.left=i*154+"px";
    if(i===0){
        document.getElementsByTagName("h2")[k].style.left="42px";
        document.getElementsByTagName("h7")[k].style.left="42px";
    }
    k++;
   }
}
}

我需要额外的if语句来确保内部循环不会比外部循环更长。